@azrico/reactgrid 1.0.8 → 1.0.9

package/dist/src/views/DataGrid.js

@@ -52,7 +52,7 @@ function AzGrid(props) {
       };
       if (typeof r === 'object') {
         let final_cl = {
-          name: r.field || r.name || r.key || r.columnName,
+          name: get_col_name(r),
           header: r.header || r.title || r.name || '-',
           width: r.width || undefined
         };
@@ -73,7 +73,7 @@ function AzGrid(props) {
     /* ---------------------------- apply extensions ---------------------------- */
     if (mcolExts && Array.isArray(mcolExts)) for (let index = 0; index < mcolExts.length; index++) {
       const ext = mcolExts[index];
-      const ext_cl = ext.columnName || ext.name || ext.field;
+      const ext_cl = get_col_name(ext);
       const mcol = final_columns.find(s => s.name === ext_cl);
       if (!mcol) continue;
       // if (ext.width) mcol.width = ext.width;
@@ -82,7 +82,7 @@ function AzGrid(props) {
     /* ------------------------------- frozen cols ------------------------------ */
     if (Array.isArray(leftColumns)) {
       for (let index = 0; index < leftColumns.length; index++) {
-        const r = leftColumns[index];
+        const r = get_col_name(leftColumns[index]);
         const mcol = final_columns.find(s => s.name === r);
         if (mcol) {
           mcol.locked = 'start';
@@ -91,7 +91,7 @@ function AzGrid(props) {
     }
     if (Array.isArray(rightColumns)) {
       for (let index = 0; index < rightColumns.length; index++) {
-        const r = rightColumns[index];
+        const r = get_col_name(rightColumns[index]);
         const mcol = final_columns.find(s => s.name === r);
         if (mcol) {
           mcol.locked = 'end';
@@ -101,7 +101,7 @@ function AzGrid(props) {
     /* -------------------------------- ediatable ------------------------------- */
     if (Array.isArray(editableColumns)) {
       for (let index = 0; index < editableColumns.length; index++) {
-        const r = editableColumns[index];
+        const r = get_col_name(editableColumns[index]);
         const mcol = final_columns.find(s => s.name === r);
         if (mcol) {
           // mcol.editor = editorWrapper;
@@ -114,7 +114,8 @@ function AzGrid(props) {
     if (Array.isArray(customColumns)) {
       for (let index = 0; index < customColumns.length; index++) {
         const r = customColumns[index];
-        const mcol = final_columns.find(s => s.name === r.name);
+        const rn = get_col_name(r);
+        const mcol = final_columns.find(s => s.name === rn);
         if (mcol) {
           //@ts-ignore
           mcol.render = r.render;
@@ -171,7 +172,6 @@ function DataGrid(props) {
   const gridRef = _react.default.useRef(null);
   const [menuAnchorEl, set_menuAnchorEl] = _react.default.useState(null);
   const [menuRow, set_menuRow] = _react.default.useState(null);
-  const gridID = _react.default.useMemo(() => 'table-' + Date.now().valueOf(), []);
   /* -------------------------------------------------------------------------- */
   /*                               Create the grid                              */
   /* -------------------------------------------------------------------------- */
@@ -250,6 +250,12 @@ function DataGrid(props) {
   }));
 }
 /* -------------------------------------------------------------------------- */
+function get_col_name(obj) {
+  if (!obj) return 'default';
+  if (typeof obj == 'string') return obj;
+  if (typeof obj != 'object') return 'default';
+  return obj.name || obj.field || obj.key || obj.columnName || 'default';
+}
 function get_default_key() {
   return 'ExpiryDate=2999-01-01,Z=1040577552';
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@azrico/reactgrid",
-	"version": "1.0.8",
+	"version": "1.0.9",
 	"main": "dist/index.js",
 	"description": "React Datagrid",
 	"author": "Azrideus <MehrdadTavangar@gmail.com>",

package/src/views/DataGrid.tsx

@@ -124,7 +124,7 @@ export function AzGrid(props: AzGridProps) {
 				if (typeof r === 'string') return { field: r, header: r };
 				if (typeof r === 'object') {
 					let final_cl: MakeWriteable<ColumnDefinition> = {
-						name: r.field || r.name || r.key || r.columnName,
+						name: get_col_name(r),
 						header: r.header || r.title || r.name || '-',
 						width: r.width || undefined,
 					};
@@ -148,7 +148,7 @@ export function AzGrid(props: AzGridProps) {
 		if (mcolExts && Array.isArray(mcolExts))
 			for (let index = 0; index < mcolExts.length; index++) {
 				const ext = mcolExts[index];
-				const ext_cl = ext.columnName || ext.name || ext.field;
+				const ext_cl = get_col_name(ext);
 				const mcol = final_columns.find((s) => s.name === ext_cl);
 				if (!mcol) continue;
 				// if (ext.width) mcol.width = ext.width;
@@ -158,7 +158,7 @@ export function AzGrid(props: AzGridProps) {
 		/* ------------------------------- frozen cols ------------------------------ */
 		if (Array.isArray(leftColumns)) {
 			for (let index = 0; index < leftColumns.length; index++) {
-				const r = leftColumns[index];
+				const r = get_col_name(leftColumns[index]);
 				const mcol = final_columns.find((s) => s.name === r);
 				if (mcol) {
 					mcol.locked = 'start';
@@ -167,7 +167,7 @@ export function AzGrid(props: AzGridProps) {
 		}
 		if (Array.isArray(rightColumns)) {
 			for (let index = 0; index < rightColumns.length; index++) {
-				const r = rightColumns[index];
+				const r = get_col_name(rightColumns[index]);
 				const mcol = final_columns.find((s) => s.name === r);
 				if (mcol) {
 					mcol.locked = 'end';
@@ -177,7 +177,7 @@ export function AzGrid(props: AzGridProps) {
 		/* -------------------------------- ediatable ------------------------------- */
 		if (Array.isArray(editableColumns)) {
 			for (let index = 0; index < editableColumns.length; index++) {
-				const r = editableColumns[index];
+				const r = get_col_name(editableColumns[index]);
 				const mcol = final_columns.find((s) => s.name === r);
 				if (mcol) {
 					// mcol.editor = editorWrapper;
@@ -190,7 +190,8 @@ export function AzGrid(props: AzGridProps) {
 		if (Array.isArray(customColumns)) {
 			for (let index = 0; index < customColumns.length; index++) {
 				const r = customColumns[index];
-				const mcol = final_columns.find((s) => s.name === r.name);
+				const rn = get_col_name(r);
+				const mcol = final_columns.find((s) => s.name === rn);
 				if (mcol) {
 					//@ts-ignore
 					mcol.render = r.render;
@@ -243,8 +244,6 @@ function DataGrid(props: DataGridProps) {
 	const [menuAnchorEl, set_menuAnchorEl] = React.useState<any>(null);
 	const [menuRow, set_menuRow] = React.useState<any>(null);
 
-	const gridID = React.useMemo(() => 'table-' + Date.now().valueOf(), []);
-
 	/* -------------------------------------------------------------------------- */
 	/*                               Create the grid                              */
 	/* -------------------------------------------------------------------------- */
@@ -317,6 +316,13 @@ function DataGrid(props: DataGridProps) {
 	);
 }
 /* -------------------------------------------------------------------------- */
+
+function get_col_name(obj: any): string {
+	if (!obj) return 'default';
+	if (typeof obj == 'string') return obj;
+	if (typeof obj != 'object') return 'default';
+	return obj.name || obj.field || obj.key || obj.columnName || 'default';
+}
 function get_default_key() {
 	return 'ExpiryDate=2999-01-01,Z=1040577552';
 }