@azrico/reactgrid 1.2.31 → 1.2.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/dist/src/func/func_child.d.ts +1 -1
- package/dist/src/func/func_child.js +4 -3
- package/dist/src/index.js +11 -6
- package/dist/src/views/DataGrid.js +10 -8
- package/package.json +5 -4
- package/src/func/func_child.ts +4 -3
- package/src/index.tsx +5 -6
- package/src/views/DataGrid.tsx +16 -18
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
### [1.2.33](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.32...v1.2.33) (2023-04-12)
|
|
6
|
+
|
|
7
|
+
### [1.2.32](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.31...v1.2.32) (2023-04-11)
|
|
8
|
+
|
|
5
9
|
### [1.2.31](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.30...v1.2.31) (2023-04-03)
|
|
6
10
|
|
|
7
11
|
### [1.2.30](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.29...v1.2.30) (2023-04-03)
|
|
@@ -5,7 +5,7 @@ type mrow = {
|
|
|
5
5
|
};
|
|
6
6
|
export declare function fix_parent_child_relations<T extends mrow>(rows: T[]): T[];
|
|
7
7
|
export declare class func_selection {
|
|
8
|
-
static getVirtualElement(x?: number, y?: number):
|
|
8
|
+
static getVirtualElement(x?: number, y?: number): {
|
|
9
9
|
getBoundingClientRect: () => {
|
|
10
10
|
width: number;
|
|
11
11
|
height: number;
|
|
@@ -48,9 +48,10 @@ function assign_children(row, all_rows) {
|
|
|
48
48
|
}
|
|
49
49
|
class func_selection {
|
|
50
50
|
static getVirtualElement(x = 0, y = 0) {
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
51
|
+
const boundsRect = func_selection.generateGetBoundingClientRect(x, y);
|
|
52
|
+
return {
|
|
53
|
+
getBoundingClientRect: boundsRect
|
|
54
|
+
};
|
|
54
55
|
}
|
|
55
56
|
static generateGetBoundingClientRect(x = 0, y = 0) {
|
|
56
57
|
return () => ({
|
package/dist/src/index.js
CHANGED
|
@@ -47,13 +47,18 @@ Object.keys(_DataGrid).forEach(function (key) {
|
|
|
47
47
|
});
|
|
48
48
|
});
|
|
49
49
|
var _func_grid = require("./func/func_grid");
|
|
50
|
+
var _example = _interopRequireDefault(require("./example"));
|
|
51
|
+
var _react = _interopRequireDefault(require("react"));
|
|
52
|
+
var _client = _interopRequireDefault(require("react-dom/client"));
|
|
53
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
50
54
|
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); }
|
|
51
55
|
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; }
|
|
52
56
|
/* -------------------------------------------------------------------------- */
|
|
53
57
|
//
|
|
54
|
-
var _default = _DataGrid.default;
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
58
|
+
var _default = _DataGrid.default;
|
|
59
|
+
exports.default = _default;
|
|
60
|
+
const testroot = document.getElementById('testroot');
|
|
61
|
+
if (testroot) {
|
|
62
|
+
const root = _client.default.createRoot(document.getElementById('testroot'));
|
|
63
|
+
root.render(_react.default.createElement(_example.default, null));
|
|
64
|
+
}
|
|
@@ -119,8 +119,9 @@ function DataGridEventsWrapper(props) {
|
|
|
119
119
|
/* --------------------------------- events --------------------------------- */
|
|
120
120
|
const onRowContextMenu = _react.default.useCallback((rowProps, event) => {
|
|
121
121
|
if (!rowProps || !rowProps.data || _func_child.func_selection.has_selection()) return;
|
|
122
|
+
const anEl = _func_child.func_selection.getVirtualElement(event.clientX, event.clientY);
|
|
122
123
|
update_menuRow(rowProps.data);
|
|
123
|
-
update_menuAnchorEl(
|
|
124
|
+
update_menuAnchorEl(anEl);
|
|
124
125
|
event.preventDefault();
|
|
125
126
|
}, []);
|
|
126
127
|
const onRowClick = _react.default.useCallback((rowProps, event) => {
|
|
@@ -163,12 +164,14 @@ function DataGridEventsWrapper(props) {
|
|
|
163
164
|
...events
|
|
164
165
|
};
|
|
165
166
|
}, [props.static_gridOptions, onRowClick]);
|
|
166
|
-
const contextMenu = _react.default.
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
167
|
+
const contextMenu = _react.default.useMemo(() => {
|
|
168
|
+
return _react.default.createElement(_controls.ContextMenu, {
|
|
169
|
+
menuAnchorEl: menuAnchorEl,
|
|
170
|
+
set_menuAnchorEl: update_menuAnchorEl,
|
|
171
|
+
menuRow: menuRow,
|
|
172
|
+
menu_items: props.contextMenuItems
|
|
173
|
+
});
|
|
174
|
+
}, [menuAnchorEl, menuRow, props.contextMenuItems]);
|
|
172
175
|
if (props.details_dataSource) {
|
|
173
176
|
return _react.default.createElement(DataGridDetailsWrapper, {
|
|
174
177
|
...props,
|
|
@@ -194,7 +197,6 @@ function DataGridDetailsWrapper(props) {
|
|
|
194
197
|
cached_data: cached_data,
|
|
195
198
|
last_cache_info: last_cache_info
|
|
196
199
|
});
|
|
197
|
-
console.log('ds', res);
|
|
198
200
|
return res;
|
|
199
201
|
}, [props.dataSource]);
|
|
200
202
|
const renderDetailsGrid = ({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@azrico/reactgrid",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.33",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"description": "React Datagrid",
|
|
6
6
|
"author": "Azrideus <MehrdadTavangar@gmail.com>",
|
|
@@ -29,8 +29,8 @@
|
|
|
29
29
|
"typescript": "^4.8.4"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@azrico/controls": "1.
|
|
33
|
-
"@azrico/object": "^1.
|
|
32
|
+
"@azrico/controls": "1.5.12",
|
|
33
|
+
"@azrico/object": "^1.4.12",
|
|
34
34
|
"@emotion/react": "^11.9.3",
|
|
35
35
|
"@emotion/styled": "^11.9.3",
|
|
36
36
|
"@inovua/reactdatagrid-enterprise": "^5.8.5",
|
|
@@ -39,7 +39,8 @@
|
|
|
39
39
|
"react-use-size": "^3.0.1"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
|
-
"@azrico/controls": ">=1.
|
|
42
|
+
"@azrico/controls": ">=1.5.12",
|
|
43
|
+
"@azrico/object": "^>=1.4.12",
|
|
43
44
|
"@emotion/react": ">=11.9.3",
|
|
44
45
|
"@emotion/styled": ">=11.9.3",
|
|
45
46
|
"@inovua/reactdatagrid-enterprise": ">=5.8.5",
|
package/src/func/func_child.ts
CHANGED
|
@@ -46,9 +46,10 @@ function assign_children(row: converted_row, all_rows: converted_row[]) {
|
|
|
46
46
|
}
|
|
47
47
|
export class func_selection {
|
|
48
48
|
static getVirtualElement(x = 0, y = 0) {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
49
|
+
const boundsRect = func_selection.generateGetBoundingClientRect(x, y);
|
|
50
|
+
return {
|
|
51
|
+
getBoundingClientRect: boundsRect,
|
|
52
|
+
};
|
|
52
53
|
}
|
|
53
54
|
static generateGetBoundingClientRect(x = 0, y = 0) {
|
|
54
55
|
return () => ({
|
package/src/index.tsx
CHANGED
|
@@ -10,9 +10,8 @@ import ReactDOM from 'react-dom/client';
|
|
|
10
10
|
//
|
|
11
11
|
export default AzGrid;
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
// }
|
|
13
|
+
const testroot = document.getElementById('testroot');
|
|
14
|
+
if (testroot) {
|
|
15
|
+
const root = ReactDOM.createRoot(document.getElementById('testroot') as HTMLElement);
|
|
16
|
+
root.render(<ExampleGrid />);
|
|
17
|
+
}
|
package/src/views/DataGrid.tsx
CHANGED
|
@@ -27,11 +27,11 @@ import {
|
|
|
27
27
|
TypeRowSelection,
|
|
28
28
|
} from '@inovua/reactdatagrid-community/types';
|
|
29
29
|
import { fix_parent_child_relations, func_selection } from '../func/func_child';
|
|
30
|
+
import { fn_eval, object_equals } from '@azrico/object';
|
|
30
31
|
|
|
31
32
|
import ReactDataGrid from '@inovua/reactdatagrid-enterprise';
|
|
32
33
|
import { TypeOnSelectionChangeArg } from '@inovua/reactdatagrid-community/types/TypeDataGridProps';
|
|
33
34
|
import clsx from 'clsx';
|
|
34
|
-
import { object_equals } from '@azrico/object';
|
|
35
35
|
import { useComponentSize } from 'react-use-size';
|
|
36
36
|
|
|
37
37
|
/* -------------------------------------------------------------------------- */
|
|
@@ -265,8 +265,10 @@ function DataGridEventsWrapper(props: DataGridWrapperProps) {
|
|
|
265
265
|
|
|
266
266
|
const onRowContextMenu = React.useCallback((rowProps, event) => {
|
|
267
267
|
if (!rowProps || !rowProps.data || func_selection.has_selection()) return;
|
|
268
|
+
|
|
269
|
+
const anEl = func_selection.getVirtualElement(event.clientX, event.clientY);
|
|
268
270
|
update_menuRow(rowProps.data);
|
|
269
|
-
update_menuAnchorEl(
|
|
271
|
+
update_menuAnchorEl(anEl);
|
|
270
272
|
event.preventDefault();
|
|
271
273
|
}, []);
|
|
272
274
|
const onRowClick = React.useCallback(
|
|
@@ -318,14 +320,16 @@ function DataGridEventsWrapper(props: DataGridWrapperProps) {
|
|
|
318
320
|
return { ...props.static_gridOptions, ...events };
|
|
319
321
|
}, [props.static_gridOptions, onRowClick]);
|
|
320
322
|
|
|
321
|
-
const contextMenu = (
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
323
|
+
const contextMenu = React.useMemo(() => {
|
|
324
|
+
return (
|
|
325
|
+
<ContextMenu
|
|
326
|
+
menuAnchorEl={menuAnchorEl}
|
|
327
|
+
set_menuAnchorEl={update_menuAnchorEl}
|
|
328
|
+
menuRow={menuRow}
|
|
329
|
+
menu_items={props.contextMenuItems as any}
|
|
330
|
+
/>
|
|
331
|
+
);
|
|
332
|
+
}, [menuAnchorEl, menuRow, props.contextMenuItems]);
|
|
329
333
|
|
|
330
334
|
if (props.details_dataSource) {
|
|
331
335
|
return (
|
|
@@ -358,7 +362,6 @@ function DataGridDetailsWrapper(props: DataGridWrapperProps) {
|
|
|
358
362
|
cached_data: cached_data,
|
|
359
363
|
last_cache_info: last_cache_info,
|
|
360
364
|
});
|
|
361
|
-
console.log('ds', res);
|
|
362
365
|
return res;
|
|
363
366
|
},
|
|
364
367
|
[props.dataSource]
|
|
@@ -369,7 +372,7 @@ function DataGridDetailsWrapper(props: DataGridWrapperProps) {
|
|
|
369
372
|
defaultFilterValue={props.details_filter}
|
|
370
373
|
dataSource={dataSource}
|
|
371
374
|
columns={cached_details_columns}
|
|
372
|
-
|
|
375
|
+
></ReactDataGrid>
|
|
373
376
|
);
|
|
374
377
|
};
|
|
375
378
|
|
|
@@ -382,12 +385,7 @@ function DataGridDetailsWrapper(props: DataGridWrapperProps) {
|
|
|
382
385
|
return finalresult;
|
|
383
386
|
}, [props.static_gridOptions]);
|
|
384
387
|
|
|
385
|
-
return
|
|
386
|
-
<DataGridSizeWrapper
|
|
387
|
-
{...props}
|
|
388
|
-
static_gridOptions={static_gridOptions}
|
|
389
|
-
></DataGridSizeWrapper>
|
|
390
|
-
);
|
|
388
|
+
return <DataGridSizeWrapper {...props} static_gridOptions={static_gridOptions} />;
|
|
391
389
|
}
|
|
392
390
|
|
|
393
391
|
function DataGridSizeWrapper(props: DataGridWrapperProps) {
|