@azrico/reactgrid 1.0.7 → 1.0.9

package/dist/src/views/DataGrid.d.ts

@@ -1,5 +1,6 @@
 import '@inovua/reactdatagrid-enterprise/index.css';
 import '@inovua/reactdatagrid-enterprise/theme/default-dark.css';
+import '../themes/styles.css';
 import React from 'react';
 import { TypeColumn, TypeDataGridProps, TypeDataSource, TypeRowDetailsInfo, TypeRowProps, TypeRowSelection } from '@inovua/reactdatagrid-community/types';
 import { TypeOnSelectionChangeArg } from '@inovua/reactdatagrid-community/types/TypeDataGridProps';

package/dist/src/views/DataGrid.js

@@ -7,6 +7,7 @@ exports.AzGrid = AzGrid;
 exports.default = void 0;
 require("@inovua/reactdatagrid-enterprise/index.css");
 require("@inovua/reactdatagrid-enterprise/theme/default-dark.css");
+require("../themes/styles.css");
 var _react = _interopRequireDefault(require("react"));
 var _helpers = require("./func/helpers");
 var _controls = require("@azrico/controls");
@@ -51,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
         };
@@ -72,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;
@@ -81,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';
@@ -90,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';
@@ -100,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;
@@ -113,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;
@@ -170,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                              */
   /* -------------------------------------------------------------------------- */
@@ -249,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,16 +1,15 @@
 {
 	"name": "@azrico/reactgrid",
-	"version": "1.0.7",
+	"version": "1.0.9",
 	"main": "dist/index.js",
 	"description": "React Datagrid",
 	"author": "Azrideus <MehrdadTavangar@gmail.com>",
 	"homepage": ".",
 	"scripts": {
 		"start": "react-scripts start",
-		"build": "tsc && babel dist --out-dir dist",
+		"build": "tsc && yarn cp_themes && babel dist --out-dir dist",
 		"test": "rem",
-		"eject": "react-scripts eject",
-		"deploy": "gh-pages -d build"
+		"cp_themes": "copyfiles ./src/themes/* ./dist/"
 	},
 	"config-overrides-path": "../../config/config-overrides.js",
 	"devDependencies": {

package/public/index.html

@@ -6,7 +6,7 @@
 	<meta name="viewport" content="width=device-width, user-scalable=no">
 	<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
 	<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
-	<link rel="stylesheet" href="%PUBLIC_URL%/styles.css">
+
 	<title>Azriel's React Grid</title>
 </head>
 

package/src/themes/styles.css

@@ -0,0 +1,26 @@
+.azgrid-container {
+	height: 100%;
+	width: 100%;
+}
+.azgrid-borderbox {
+	box-sizing: border-box;
+}
+.azgrid-filler {
+	height: 100%;
+	width: 100%;
+}
+.azgrid-nooverflow {
+	overflow: hidden;
+}
+.azgrid-testborder {
+	border: 3px solid red;
+}
+.azgrid-pad50px {
+	padding: 50px;
+}
+.azgrid-nopad {
+	padding: 0;
+}
+.azgrid-nomargin {
+	margin: 0;
+}

package/src/views/DataGrid.tsx

@@ -1,5 +1,6 @@
 import '@inovua/reactdatagrid-enterprise/index.css';
 import '@inovua/reactdatagrid-enterprise/theme/default-dark.css';
+import '../themes/styles.css';
 
 import React, { useCallback, useState } from 'react';
 import {
@@ -123,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,
 					};
@@ -147,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;
@@ -157,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';
@@ -166,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';
@@ -176,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;
@@ -189,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;
@@ -242,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                              */
 	/* -------------------------------------------------------------------------- */
@@ -316,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';
 }