@azrico/reactgrid 1.2.31 → 1.2.32
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 +2 -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 +12 -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 +17 -18
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
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.32](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.31...v1.2.32) (2023-04-11)
|
|
6
|
+
|
|
5
7
|
### [1.2.31](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.30...v1.2.31) (2023-04-03)
|
|
6
8
|
|
|
7
9
|
### [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
|
+
}
|
|
@@ -14,6 +14,7 @@ var _func_grid = require("../func/func_grid");
|
|
|
14
14
|
var _controls = require("@azrico/controls");
|
|
15
15
|
var _react = _interopRequireDefault(require("react"));
|
|
16
16
|
var _func_child = require("../func/func_child");
|
|
17
|
+
var _object = require("@azrico/object");
|
|
17
18
|
var _reactdatagridEnterprise = _interopRequireDefault(require("@inovua/reactdatagrid-enterprise"));
|
|
18
19
|
var _clsx = _interopRequireDefault(require("clsx"));
|
|
19
20
|
var _reactUseSize = require("react-use-size");
|
|
@@ -119,8 +120,9 @@ function DataGridEventsWrapper(props) {
|
|
|
119
120
|
/* --------------------------------- events --------------------------------- */
|
|
120
121
|
const onRowContextMenu = _react.default.useCallback((rowProps, event) => {
|
|
121
122
|
if (!rowProps || !rowProps.data || _func_child.func_selection.has_selection()) return;
|
|
123
|
+
const anEl = _func_child.func_selection.getVirtualElement(event.clientX, event.clientY);
|
|
122
124
|
update_menuRow(rowProps.data);
|
|
123
|
-
update_menuAnchorEl(
|
|
125
|
+
update_menuAnchorEl(anEl);
|
|
124
126
|
event.preventDefault();
|
|
125
127
|
}, []);
|
|
126
128
|
const onRowClick = _react.default.useCallback((rowProps, event) => {
|
|
@@ -163,12 +165,15 @@ function DataGridEventsWrapper(props) {
|
|
|
163
165
|
...events
|
|
164
166
|
};
|
|
165
167
|
}, [props.static_gridOptions, onRowClick]);
|
|
166
|
-
const contextMenu = _react.default.
|
|
167
|
-
menuAnchorEl: menuAnchorEl,
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
168
|
+
const contextMenu = _react.default.useMemo(() => {
|
|
169
|
+
console.log('menuAnchorEl:', menuAnchorEl, (0, _object.fn_eval)(menuAnchorEl));
|
|
170
|
+
return _react.default.createElement(_controls.ContextMenu, {
|
|
171
|
+
menuAnchorEl: menuAnchorEl,
|
|
172
|
+
set_menuAnchorEl: update_menuAnchorEl,
|
|
173
|
+
menuRow: menuRow,
|
|
174
|
+
menu_items: props.contextMenuItems
|
|
175
|
+
});
|
|
176
|
+
}, [menuAnchorEl, menuRow, props.contextMenuItems]);
|
|
172
177
|
if (props.details_dataSource) {
|
|
173
178
|
return _react.default.createElement(DataGridDetailsWrapper, {
|
|
174
179
|
...props,
|
|
@@ -194,7 +199,6 @@ function DataGridDetailsWrapper(props) {
|
|
|
194
199
|
cached_data: cached_data,
|
|
195
200
|
last_cache_info: last_cache_info
|
|
196
201
|
});
|
|
197
|
-
console.log('ds', res);
|
|
198
202
|
return res;
|
|
199
203
|
}, [props.dataSource]);
|
|
200
204
|
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.32",
|
|
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,17 @@ 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
|
+
console.log('menuAnchorEl:', menuAnchorEl, fn_eval(menuAnchorEl));
|
|
325
|
+
return (
|
|
326
|
+
<ContextMenu
|
|
327
|
+
menuAnchorEl={menuAnchorEl}
|
|
328
|
+
set_menuAnchorEl={update_menuAnchorEl}
|
|
329
|
+
menuRow={menuRow}
|
|
330
|
+
menu_items={props.contextMenuItems as any}
|
|
331
|
+
/>
|
|
332
|
+
);
|
|
333
|
+
}, [menuAnchorEl, menuRow, props.contextMenuItems]);
|
|
329
334
|
|
|
330
335
|
if (props.details_dataSource) {
|
|
331
336
|
return (
|
|
@@ -358,7 +363,6 @@ function DataGridDetailsWrapper(props: DataGridWrapperProps) {
|
|
|
358
363
|
cached_data: cached_data,
|
|
359
364
|
last_cache_info: last_cache_info,
|
|
360
365
|
});
|
|
361
|
-
console.log('ds', res);
|
|
362
366
|
return res;
|
|
363
367
|
},
|
|
364
368
|
[props.dataSource]
|
|
@@ -369,7 +373,7 @@ function DataGridDetailsWrapper(props: DataGridWrapperProps) {
|
|
|
369
373
|
defaultFilterValue={props.details_filter}
|
|
370
374
|
dataSource={dataSource}
|
|
371
375
|
columns={cached_details_columns}
|
|
372
|
-
|
|
376
|
+
></ReactDataGrid>
|
|
373
377
|
);
|
|
374
378
|
};
|
|
375
379
|
|
|
@@ -382,12 +386,7 @@ function DataGridDetailsWrapper(props: DataGridWrapperProps) {
|
|
|
382
386
|
return finalresult;
|
|
383
387
|
}, [props.static_gridOptions]);
|
|
384
388
|
|
|
385
|
-
return
|
|
386
|
-
<DataGridSizeWrapper
|
|
387
|
-
{...props}
|
|
388
|
-
static_gridOptions={static_gridOptions}
|
|
389
|
-
></DataGridSizeWrapper>
|
|
390
|
-
);
|
|
389
|
+
return <DataGridSizeWrapper {...props} static_gridOptions={static_gridOptions} />;
|
|
391
390
|
}
|
|
392
391
|
|
|
393
392
|
function DataGridSizeWrapper(props: DataGridWrapperProps) {
|