@azrico/reactgrid 1.2.13 → 1.2.14

package/dist/src/func/func_grid.js

@@ -1,280 +1,291 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ApplyColumnData = ApplyColumnData;
-exports.ApplyDataSource = ApplyDataSource;
-exports.get_col_header = get_col_header;
-exports.get_col_name = get_col_name;
-exports.get_default_key = get_default_key;
-exports.get_row_id = get_row_id;
-exports.to_datasource = to_datasource;
-exports.validateCache = validateCache;
-var _BoolEditor = _interopRequireDefault(require("@inovua/reactdatagrid-community/BoolEditor"));
-var _NumericEditor = _interopRequireDefault(require("@inovua/reactdatagrid-community/NumericEditor"));
-var _SelectEditor = _interopRequireDefault(require("@inovua/reactdatagrid-community/SelectEditor"));
-var _func_child = require("./func_child");
-var _object = require("@azrico/object");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const defaultColumnOptions = {
-  draggable: false,
-  lockable: false,
-  editable: false
-};
-async function ApplyDataSource(datasource, props) {
-  let result_data = undefined;
-  let isUsingCache = false;
-  const cacheInfo = {
-    ds: datasource,
-    skip: props.skip,
-    limit: props.limit
-  };
-  //check if we can used cached data
-  //if the datasource is changed since last render, we should invalidate cache
-  if (!validateCache(props.last_cache_info.current, cacheInfo, props.looseCacheCheck)) {
-    props.cached_data.current = undefined;
-    props.last_cache_info.current = cacheInfo;
-  }
-  if (props.cached_data.current) {
-    //cache is valid, use the cache
-    isUsingCache = true;
-    result_data = props.cached_data.current;
-  } else {
-    //cache is invalid, use the datasource again
-    isUsingCache = false;
-    if (typeof datasource === 'function') {
-      result_data = await datasource(props);
-    } else result_data = datasource;
-  }
-  //making sure the datasource is a valid object :
-  if (!result_data) result_data = [];
-  if (Array.isArray(result_data) || typeof result_data !== 'object') result_data = {
-    data: result_data
-  };
-  if (!Array.isArray(result_data.data)) result_data.data = [result_data.data];
-  //no need to fix parent/child when using cache (it should be already fixed)
-  if (!isUsingCache && props.allowChildRows) {
-    result_data.data = (0, _func_child.fix_parent_child_relations)(result_data.data);
-  }
-  if (!result_data.count) {
-    result_data.count = result_data.data.length;
-  }
-  //update cache
-  props.cached_data.current = result_data;
-  return result_data;
-}
+import BoolEditor from '@inovua/reactdatagrid-community/BoolEditor';
+import NumericEditor from '@inovua/reactdatagrid-community/NumericEditor';
+import SelectEditor from '@inovua/reactdatagrid-community/SelectEditor';
+import { fix_parent_child_relations } from './func_child';
+import { object_equals } from '@azrico/object';
+const defaultColumnOptions = {
+    draggable: false,
+    lockable: false,
+    editable: false,
+};
+export async function ApplyDataSource(datasource, props) {
+    let result_data = undefined;
+    let isUsingCache = false;
+    const cacheInfo = { ds: datasource, skip: props.skip, limit: props.limit };
+    //check if we can used cached data
+    //if the datasource is changed since last render, we should invalidate cache
+    if (!validateCache(props.last_cache_info.current, cacheInfo, props.looseCacheCheck)) {
+        props.cached_data.current = undefined;
+        props.last_cache_info.current = cacheInfo;
+    }
+    if (props.cached_data.current) {
+        //cache is valid, use the cache
+        isUsingCache = true;
+        result_data = props.cached_data.current;
+    }
+    else {
+        //cache is invalid, use the datasource again
+        isUsingCache = false;
+        if (typeof datasource === 'function') {
+            result_data = await datasource(props);
+        }
+        else
+            result_data = datasource;
+    }
+    //making sure the datasource is a valid object :
+    if (!result_data)
+        result_data = [];
+    if (Array.isArray(result_data) || typeof result_data !== 'object')
+        result_data = { data: result_data };
+    if (!Array.isArray(result_data.data))
+        result_data.data = [result_data.data];
+    //no need to fix parent/child when using cache (it should be already fixed)
+    if (!isUsingCache && props.allowChildRows) {
+        result_data.data = fix_parent_child_relations(result_data.data);
+    }
+    if (!result_data.count) {
+        result_data.count = result_data.data.length;
+    }
+    //update cache
+    props.cached_data.current = result_data;
+    return result_data;
+}
 /**
  * merges together all different props for columns
  * to build a single final column data array
  * @param column_data
  * @returns
- */
-function ApplyColumnData(column_data) {
-  const final_columns = [];
-  if (!column_data) column_data = {};
-  if (Array.isArray(column_data)) column_data = {
-    columns: column_data
-  };
-  let mcols = column_data.columns || [];
-  let mcolExts = column_data.columnExtensions || [];
-  let rightColumns = column_data.rightColumns || [];
-  let leftColumns = column_data.leftColumns || [];
-  let editableColumns = column_data.editableColumns || [];
-  let customColumns = column_data.customColumns || [];
-  if (!Array.isArray(mcols)) return [];
-  /* ------------------------------- fix columns ------------------------------ */
-  mcols.map(r => {
-    if (r == null) return null;
-    if (typeof r === 'string') return {
-      field: r,
-      header: r
-    };
-    if (typeof r === 'object') {
-      let final_cl = {
-        name: get_col_name(r),
-        header: get_col_header(r),
-        width: r.width || undefined
-      };
-      final_cl = {
-        ...defaultColumnOptions,
-        ...r,
-        ...final_cl
-      };
-      return final_cl;
-    }
-    return null;
-  }).forEach(r => {
-    if (r != null) final_columns.push(r);
-  });
-  /* ---------------------------- apply extensions ---------------------------- */
-  if (mcolExts && Array.isArray(mcolExts)) for (let index = 0; index < mcolExts.length; index++) {
-    const ext = mcolExts[index];
-    const ext_cl = get_col_name(ext);
-    if (!ext_cl) {
-      console.warn('ColumnExtension must have a name');
-      continue;
-    }
-    const mcol = final_columns.find(s => get_col_name(s) === ext_cl);
-    if (mcol) {
-      for (const key in ext) {
-        if (!mcol[key] && key != 'name') mcol[key] = ext[key];
-      }
-    }
-    // if (ext.widthGrow) mcol.widthGrow = ext.widthGrow;
-  }
-  /* ------------------------------- frozen cols ------------------------------ */
-  if (Array.isArray(leftColumns)) {
-    for (let index = 0; index < leftColumns.length; index++) {
-      const r = get_col_name(leftColumns[index]);
-      const mcol = final_columns.find(s => get_col_name(s) === r);
-      if (mcol) {
-        mcol.locked = 'start';
-      }
-    }
-  }
-  if (Array.isArray(rightColumns)) {
-    for (let index = 0; index < rightColumns.length; index++) {
-      const r = get_col_name(rightColumns[index]);
-      const mcol = final_columns.find(s => get_col_name(s) === r);
-      if (mcol) {
-        mcol.locked = 'end';
-      }
-    }
-  }
-  /* -------------------------------- ediatable ------------------------------- */
-  if (Array.isArray(editableColumns)) {
-    for (let index = 0; index < editableColumns.length; index++) {
-      const r = get_col_name(editableColumns[index]);
-      const mcol = final_columns.find(s => get_col_name(s) === r);
-      if (mcol) {
-        mcol.editable = true;
-      }
-    }
-  }
-  for (let index = 0; index < final_columns.length; index++) {
-    const col = final_columns[index];
-    if (col.type) {
-      switch (col.type) {
-        case 'combo':
-        case 'select':
-          //@ts-ignore
-          col.editor = _SelectEditor.default;
-          break;
-        case 'number':
-        case 'numberic':
-          //@ts-ignore
-          col.editor = _NumericEditor.default;
-          break;
-        case 'truefalse':
-        case 'bool':
-          //@ts-ignore
-          col.editor = _BoolEditor.default;
-          break;
-      }
-      if (col.editable != false) col.editable = true;
-      delete col.type;
-    }
-    //@ts-ignore
-    if (!col.editorProps) col.editorProps = {};
-    if (col.items) {
-      //@ts-ignore
-      if (!col.editorProps.idProperty) col.editorProps.idProperty = 'id';
-      //@ts-ignore
-      if (!col.editorProps.collapseOnSelect) col.editorProps.collapseOnSelect = true;
-      //@ts-ignore
-      col.editorProps.dataSource = to_datasource(col.items, col.editorProps.idProperty);
-      delete col.items;
-    }
-  }
-  /* -------------------------------------------------------------------------- */
-  if (Array.isArray(customColumns)) {
-    for (let index = 0; index < customColumns.length; index++) {
-      const r = customColumns[index];
-      const rn = get_col_name(r);
-      const mcol = final_columns.find(s => get_col_name(s) === rn);
-      if (mcol) {
-        //@ts-ignore
-        mcol.render = r.render;
-      }
-    }
-  }
-  /* ------------------------------ apply renames ----------------------------- */
-  for (let index = 0; index < final_columns.length; index++) {
-    const col = final_columns[index];
-    if (!col.name) {
-      col.name = get_col_name(col);
-      delete col.field;
-      delete col.key;
-      delete col.columnName;
-      if (col.flex && !col.defaultFlex) col.defaultFlex = col.flex;
-    }
-  }
-  /* -------------------------------------------------------------------------- */
-  //console.log(final_columns);
-  return final_columns;
-}
-function to_datasource(arr, idProperty, valueAsID = true) {
-  const res = [];
-  let index = 0;
-  if (Array.isArray(arr)) {
-    arr.map(s => {
-      let elem = {};
-      if (valueAsID) elem[idProperty] = String(s).toLowerCase();else elem[idProperty] = '_cid_' + index;
-      if (typeof s === 'object') elem = {
-        ...elem,
-        ...s
-      };else elem['label'] = s;
-      res.push(elem);
-      index++;
-    });
-  }
-  return res;
-}
+ */
+export function ApplyColumnData(column_data) {
+    const final_columns = [];
+    if (!column_data)
+        column_data = {};
+    if (Array.isArray(column_data))
+        column_data = { columns: column_data };
+    let mcols = column_data.columns || [];
+    let mcolExts = column_data.columnExtensions || [];
+    let rightColumns = column_data.rightColumns || [];
+    let leftColumns = column_data.leftColumns || [];
+    let editableColumns = column_data.editableColumns || [];
+    let customColumns = column_data.customColumns || [];
+    if (!Array.isArray(mcols))
+        return [];
+    /* ------------------------------- fix columns ------------------------------ */
+    mcols
+        .map((r) => {
+        if (r == null)
+            return null;
+        if (typeof r === 'string')
+            return { field: r, header: r };
+        if (typeof r === 'object') {
+            let final_cl = {
+                name: get_col_name(r),
+                header: get_col_header(r),
+                width: r.width || undefined,
+            };
+            final_cl = {
+                ...defaultColumnOptions,
+                ...r,
+                ...final_cl,
+            };
+            return final_cl;
+        }
+        return null;
+    })
+        .forEach((r) => {
+        if (r != null)
+            final_columns.push(r);
+    });
+    /* ---------------------------- apply extensions ---------------------------- */
+    if (mcolExts && Array.isArray(mcolExts))
+        for (let index = 0; index < mcolExts.length; index++) {
+            const ext = mcolExts[index];
+            const ext_cl = get_col_name(ext);
+            if (!ext_cl) {
+                console.warn('ColumnExtension must have a name');
+                continue;
+            }
+            const mcol = final_columns.find((s) => get_col_name(s) === ext_cl);
+            if (mcol) {
+                for (const key in ext) {
+                    if (!mcol[key] && key != 'name')
+                        mcol[key] = ext[key];
+                }
+            }
+            // if (ext.widthGrow) mcol.widthGrow = ext.widthGrow;
+        }
+    /* ------------------------------- frozen cols ------------------------------ */
+    if (Array.isArray(leftColumns)) {
+        for (let index = 0; index < leftColumns.length; index++) {
+            const r = get_col_name(leftColumns[index]);
+            const mcol = final_columns.find((s) => get_col_name(s) === r);
+            if (mcol) {
+                mcol.locked = 'start';
+            }
+        }
+    }
+    if (Array.isArray(rightColumns)) {
+        for (let index = 0; index < rightColumns.length; index++) {
+            const r = get_col_name(rightColumns[index]);
+            const mcol = final_columns.find((s) => get_col_name(s) === r);
+            if (mcol) {
+                mcol.locked = 'end';
+            }
+        }
+    }
+    /* -------------------------------- ediatable ------------------------------- */
+    if (Array.isArray(editableColumns)) {
+        for (let index = 0; index < editableColumns.length; index++) {
+            const r = get_col_name(editableColumns[index]);
+            const mcol = final_columns.find((s) => get_col_name(s) === r);
+            if (mcol) {
+                mcol.editable = true;
+            }
+        }
+    }
+    for (let index = 0; index < final_columns.length; index++) {
+        const col = final_columns[index];
+        if (col.type) {
+            switch (col.type) {
+                case 'combo':
+                case 'select':
+                    //@ts-ignore
+                    col.editor = SelectEditor;
+                    break;
+                case 'number':
+                case 'numberic':
+                    //@ts-ignore
+                    col.editor = NumericEditor;
+                    break;
+                case 'truefalse':
+                case 'bool':
+                    //@ts-ignore
+                    col.editor = BoolEditor;
+                    break;
+            }
+            if (col.editable != false)
+                col.editable = true;
+            delete col.type;
+        }
+        //@ts-ignore
+        if (!col.editorProps)
+            col.editorProps = {};
+        if (col.items) {
+            //@ts-ignore
+            if (!col.editorProps.idProperty)
+                col.editorProps.idProperty = 'id';
+            //@ts-ignore
+            if (!col.editorProps.collapseOnSelect)
+                col.editorProps.collapseOnSelect = true;
+            //@ts-ignore
+            col.editorProps.dataSource = to_datasource(col.items, col.editorProps.idProperty);
+            delete col.items;
+        }
+    }
+    /* -------------------------------------------------------------------------- */
+    if (Array.isArray(customColumns)) {
+        for (let index = 0; index < customColumns.length; index++) {
+            const r = customColumns[index];
+            const rn = get_col_name(r);
+            const mcol = final_columns.find((s) => get_col_name(s) === rn);
+            if (mcol) {
+                //@ts-ignore
+                mcol.render = r.render;
+            }
+        }
+    }
+    /* ------------------------------ apply renames ----------------------------- */
+    for (let index = 0; index < final_columns.length; index++) {
+        const col = final_columns[index];
+        if (!col.name) {
+            col.name = get_col_name(col);
+            delete col.field;
+            delete col.key;
+            delete col.columnName;
+            if (col.flex && !col.defaultFlex)
+                col.defaultFlex = col.flex;
+        }
+    }
+    /* -------------------------------------------------------------------------- */
+    //console.log(final_columns);
+    return final_columns;
+}
+export function to_datasource(arr, idProperty, valueAsID = true) {
+    const res = [];
+    let index = 0;
+    if (Array.isArray(arr)) {
+        arr.map((s) => {
+            let elem = {};
+            if (valueAsID)
+                elem[idProperty] = String(s).toLowerCase();
+            else
+                elem[idProperty] = '_cid_' + index;
+            if (typeof s === 'object')
+                elem = { ...elem, ...s };
+            else
+                elem['label'] = s;
+            res.push(elem);
+            index++;
+        });
+    }
+    return res;
+}
 /**
  * Gets name of a column from its column object
  * @param obj
  * @returns
- */
-function get_col_name(obj) {
-  if (!obj) return '';
-  if (typeof obj == 'string') return obj;
-  if (typeof obj != 'object') return '';
-  return obj.name || obj.field || obj.key || obj.columnName || '';
-}
+ */
+export function get_col_name(obj) {
+    if (!obj)
+        return '';
+    if (typeof obj == 'string')
+        return obj;
+    if (typeof obj != 'object')
+        return '';
+    return obj.name || obj.field || obj.key || obj.columnName || '';
+}
 /**
  * Gets header of a column
  * @param obj
  * @returns
- */
-function get_col_header(obj) {
-  if (!obj) return '';
-  if (typeof obj == 'string') return obj;
-  if (typeof obj != 'object') return '';
-  return obj.header || obj.title || get_col_name(obj);
-}
+ */
+export function get_col_header(obj) {
+    if (!obj)
+        return '';
+    if (typeof obj == 'string')
+        return obj;
+    if (typeof obj != 'object')
+        return '';
+    return obj.header || obj.title || get_col_name(obj);
+}
 /**
  * Gets name of a column from its column object
  * @param obj
  * @returns
- */
-function get_row_id(obj) {
-  if (!obj) return '-1';
-  if (typeof obj == 'string') return obj;
-  if (typeof obj != 'object') return '-1';
-  return obj.__table_id || obj.id || '-1';
-}
+ */
+export function get_row_id(obj) {
+    if (!obj)
+        return '-1';
+    if (typeof obj == 'string')
+        return obj;
+    if (typeof obj != 'object')
+        return '-1';
+    return obj.__table_id || obj.id || '-1';
+}
 /**
  * Gets default activation key for grid plugin
  * @returns
- */
-function get_default_key() {
-  return 'ExpiryDate=2999-01-01,Z=1040577552';
-}
-//check if two cache objects are the same
-function validateCache(current, old, looseCheck = false) {
-  if (!old || !(0, _object.object_equals)(current, old)) return false;
-  if (looseCheck) return true;
-  if (current.ds != old.ds) return false;
-  return true;
-}
+ */
+export function get_default_key() {
+    return 'ExpiryDate=2999-01-01,Z=1040577552';
+}
+//check if two cache objects are the same
+export function validateCache(current, old, looseCheck = false) {
+    if (!old || !object_equals(current, old))
+        return false;
+    if (looseCheck)
+        return true;
+    if (current.ds != old.ds)
+        return false;
+    return true;
+}

package/dist/src/index.js

@@ -1,25 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {};
-exports.default = void 0;
-var _DataGrid = _interopRequireWildcard(require("./views/DataGrid"));
-Object.keys(_DataGrid).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _DataGrid[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _DataGrid[key];
-    }
-  });
-});
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-/* -------------------------------------------------------------------------- */
-var _default = _DataGrid.default; // const root = ReactDOM.createRoot(document.getElementById('testroot') as HTMLElement);
-// root.render(<ExampleGrid />);
-exports.default = _default;
+export * from './views/DataGrid';
+import AzGrid from './views/DataGrid';
+/* -------------------------------------------------------------------------- */
+export default AzGrid;
+// const root = ReactDOM.createRoot(document.getElementById('testroot') as HTMLElement);
+// root.render(<ExampleGrid />);

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

@@ -5,18 +5,22 @@ import '../themes/base_styles.css';
 import '../themes/grid.css';
 import { ConvertableToMenuItem } from '@azrico/controls';
 import React from 'react';
-import { TypeColumn, TypeDataGridProps, TypeDataSource, TypeEditInfo, TypeFilterTypes, TypeFilterValue, TypeRowDetailsInfo, TypeRowProps, TypeRowSelection } from '@inovua/reactdatagrid-community/types';
+import { TypeCellSelection, TypeColumn, TypeDataGridProps, TypeDataSource, TypeEditInfo, TypeFilterTypes, TypeFilterValue, TypeRowDetailsInfo, TypeRowProps, TypeRowSelection } from '@inovua/reactdatagrid-community/types';
 import { TypeOnSelectionChangeArg } from '@inovua/reactdatagrid-community/types/TypeDataGridProps';
 export type ColumnDefinition = TypeColumn;
 export type CellDefinition = any;
 export type RowDefinition = any;
 export type RowProps = TypeRowProps;
 export type RowSelectionValue = TypeRowSelection;
+export type CellSelectionValue = TypeCellSelection;
 export type DataRowDefinition = any;
 export type FilterTypes = TypeFilterTypes;
 export type FilterValues = TypeFilterValue;
 export type DataSourceDefinition = TypeDataSource;
 export type OnSelectionChangeFunc = (config: TypeOnSelectionChangeArg) => void;
+export type OnCellSelectionChangeFunc = (s: {
+    [key: string]: boolean;
+}) => void;
 export type RowDetailsFunc = (rowDetailsInfo: TypeRowDetailsInfo) => React.ReactNode;
 type loose_column_names = {
     key: string;
@@ -53,8 +57,10 @@ export type AzGridProps = {
     highlightedRow?: any;
     RowDetail?: RowDetailsFunc;
     selected?: RowSelectionValue;
+    cellSelection?: CellSelectionValue;
     onEditComplete?: (editInfo: TypeEditInfo) => void;
     onSelectionChange?: OnSelectionChangeFunc;
+    onCellSelectionChange?: OnCellSelectionChangeFunc;
     onRowClick?: (rowIndex: number, row: any) => void;
     onRowDoubleClick?: (rowIndex: number, row: any) => void;
     onLimitChange?: (v: number) => void;