@gpa-gemstone/react-table 1.2.43 → 1.2.45
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/lib/AdjustableTable/AdjustableColumn.d.ts +20 -20
- package/lib/AdjustableTable/AdjustableColumn.js +99 -100
- package/lib/AdjustableTable/AdjustableTable.d.ts +102 -102
- package/lib/AdjustableTable/AdjustableTable.js +273 -273
- package/lib/AdjustableTable/Column.d.ts +67 -67
- package/lib/AdjustableTable/Column.js +124 -125
- package/lib/DynamicTable.d.ts +37 -37
- package/lib/DynamicTable.js +45 -46
- package/lib/Paging.d.ts +6 -7
- package/lib/Paging.js +66 -66
- package/lib/SearchableTable.d.ts +15 -16
- package/lib/SearchableTable.js +51 -52
- package/lib/SelectTable.d.ts +19 -19
- package/lib/SelectTable.js +121 -122
- package/lib/Table.d.ts +99 -99
- package/lib/Table.js +105 -106
- package/lib/index.d.ts +15 -15
- package/lib/index.js +47 -47
- package/package.json +4 -4
|
@@ -1,67 +1,67 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
export interface IColumnProps<T> {
|
|
3
|
-
/**
|
|
4
|
-
* a unique Key for this Collumn
|
|
5
|
-
*/
|
|
6
|
-
Key: string;
|
|
7
|
-
/**
|
|
8
|
-
* Flag indicating whether sorting by this Collumn is allowed
|
|
9
|
-
*/
|
|
10
|
-
AllowSort?: boolean;
|
|
11
|
-
/**
|
|
12
|
-
* Optional - the Field to be used
|
|
13
|
-
*/
|
|
14
|
-
Field?: keyof T;
|
|
15
|
-
/**
|
|
16
|
-
* The Default style for the td element
|
|
17
|
-
*/
|
|
18
|
-
RowStyle?: React.CSSProperties;
|
|
19
|
-
/**
|
|
20
|
-
* The Default style for the th element
|
|
21
|
-
*/
|
|
22
|
-
HeaderStyle?: React.CSSProperties;
|
|
23
|
-
/**
|
|
24
|
-
* Determines the Content to be displaye
|
|
25
|
-
* @param d the data to be turned into content
|
|
26
|
-
* @returns the content displayed
|
|
27
|
-
*/
|
|
28
|
-
Content?: (d: {
|
|
29
|
-
item: T;
|
|
30
|
-
key: string;
|
|
31
|
-
field: keyof T | undefined;
|
|
32
|
-
index: number;
|
|
33
|
-
style?: React.CSSProperties;
|
|
34
|
-
}) => React.ReactNode;
|
|
35
|
-
}
|
|
36
|
-
export default function Column<T>(props: React.PropsWithChildren<IColumnProps<T>>): JSX.Element;
|
|
37
|
-
interface IHeaderWrapperProps<T> extends IColumnProps<T> {
|
|
38
|
-
setWidth: (w: number) => void;
|
|
39
|
-
width?: number;
|
|
40
|
-
onSort: (key: string, event: any, field?: keyof T) => void;
|
|
41
|
-
sorted: boolean;
|
|
42
|
-
asc: boolean;
|
|
43
|
-
fixedLayout: boolean;
|
|
44
|
-
}
|
|
45
|
-
export declare function ColumnHeaderWrapper<T>(props: React.PropsWithChildren<IHeaderWrapperProps<T>>): JSX.Element;
|
|
46
|
-
interface IDataWrapperProps<T> extends IColumnProps<T> {
|
|
47
|
-
width?: number;
|
|
48
|
-
item: T;
|
|
49
|
-
index: number;
|
|
50
|
-
dragStart: (data: {
|
|
51
|
-
colKey: string;
|
|
52
|
-
colField?: keyof T;
|
|
53
|
-
row: T;
|
|
54
|
-
data: T[keyof T] | null;
|
|
55
|
-
index: number;
|
|
56
|
-
}, e: any) => void;
|
|
57
|
-
onClick?: (data: {
|
|
58
|
-
colKey: string;
|
|
59
|
-
colField?: keyof T;
|
|
60
|
-
row: T;
|
|
61
|
-
data: T[keyof T] | null;
|
|
62
|
-
index: number;
|
|
63
|
-
}, e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
64
|
-
fixedLayout: boolean;
|
|
65
|
-
}
|
|
66
|
-
export declare function ColumnDataWrapper<T>(props: IDataWrapperProps<T>): JSX.Element;
|
|
67
|
-
export {};
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface IColumnProps<T> {
|
|
3
|
+
/**
|
|
4
|
+
* a unique Key for this Collumn
|
|
5
|
+
*/
|
|
6
|
+
Key: string;
|
|
7
|
+
/**
|
|
8
|
+
* Flag indicating whether sorting by this Collumn is allowed
|
|
9
|
+
*/
|
|
10
|
+
AllowSort?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Optional - the Field to be used
|
|
13
|
+
*/
|
|
14
|
+
Field?: keyof T;
|
|
15
|
+
/**
|
|
16
|
+
* The Default style for the td element
|
|
17
|
+
*/
|
|
18
|
+
RowStyle?: React.CSSProperties;
|
|
19
|
+
/**
|
|
20
|
+
* The Default style for the th element
|
|
21
|
+
*/
|
|
22
|
+
HeaderStyle?: React.CSSProperties;
|
|
23
|
+
/**
|
|
24
|
+
* Determines the Content to be displaye
|
|
25
|
+
* @param d the data to be turned into content
|
|
26
|
+
* @returns the content displayed
|
|
27
|
+
*/
|
|
28
|
+
Content?: (d: {
|
|
29
|
+
item: T;
|
|
30
|
+
key: string;
|
|
31
|
+
field: keyof T | undefined;
|
|
32
|
+
index: number;
|
|
33
|
+
style?: React.CSSProperties;
|
|
34
|
+
}) => React.ReactNode;
|
|
35
|
+
}
|
|
36
|
+
export default function Column<T>(props: React.PropsWithChildren<IColumnProps<T>>): JSX.Element;
|
|
37
|
+
interface IHeaderWrapperProps<T> extends IColumnProps<T> {
|
|
38
|
+
setWidth: (w: number) => void;
|
|
39
|
+
width?: number;
|
|
40
|
+
onSort: (key: string, event: any, field?: keyof T) => void;
|
|
41
|
+
sorted: boolean;
|
|
42
|
+
asc: boolean;
|
|
43
|
+
fixedLayout: boolean;
|
|
44
|
+
}
|
|
45
|
+
export declare function ColumnHeaderWrapper<T>(props: React.PropsWithChildren<IHeaderWrapperProps<T>>): JSX.Element;
|
|
46
|
+
interface IDataWrapperProps<T> extends IColumnProps<T> {
|
|
47
|
+
width?: number;
|
|
48
|
+
item: T;
|
|
49
|
+
index: number;
|
|
50
|
+
dragStart: (data: {
|
|
51
|
+
colKey: string;
|
|
52
|
+
colField?: keyof T;
|
|
53
|
+
row: T;
|
|
54
|
+
data: T[keyof T] | null;
|
|
55
|
+
index: number;
|
|
56
|
+
}, e: any) => void;
|
|
57
|
+
onClick?: (data: {
|
|
58
|
+
colKey: string;
|
|
59
|
+
colField?: keyof T;
|
|
60
|
+
row: T;
|
|
61
|
+
data: T[keyof T] | null;
|
|
62
|
+
index: number;
|
|
63
|
+
}, e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
64
|
+
fixedLayout: boolean;
|
|
65
|
+
}
|
|
66
|
+
export declare function ColumnDataWrapper<T>(props: IDataWrapperProps<T>): JSX.Element;
|
|
67
|
+
export {};
|
|
@@ -1,125 +1,124 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
// ******************************************************************************************************
|
|
3
|
-
// Column.tsx - Gbtc
|
|
4
|
-
//
|
|
5
|
-
// Copyright © 2018, Grid Protection Alliance. All Rights Reserved.
|
|
6
|
-
//
|
|
7
|
-
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
|
8
|
-
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
|
9
|
-
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
|
10
|
-
// file except in compliance with the License. You may obtain a copy of the License at:
|
|
11
|
-
//
|
|
12
|
-
// http://opensource.org/licenses/MIT
|
|
13
|
-
//
|
|
14
|
-
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
|
15
|
-
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
|
16
|
-
// License for the specific language governing permissions and limitations.
|
|
17
|
-
//
|
|
18
|
-
// Code Modification History:
|
|
19
|
-
// ----------------------------------------------------------------------------------------------------
|
|
20
|
-
// 08/02/2018 - Billy Ernest
|
|
21
|
-
// Generated original version of source code.
|
|
22
|
-
//
|
|
23
|
-
// ******************************************************************************************************
|
|
24
|
-
var __assign = (this && this.__assign) || function () {
|
|
25
|
-
__assign = Object.assign || function(t) {
|
|
26
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
27
|
-
s = arguments[i];
|
|
28
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
29
|
-
t[p] = s[p];
|
|
30
|
-
}
|
|
31
|
-
return t;
|
|
32
|
-
};
|
|
33
|
-
return __assign.apply(this, arguments);
|
|
34
|
-
};
|
|
35
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
-
exports.
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
var
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
var
|
|
47
|
-
var
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
style.
|
|
51
|
-
style.
|
|
52
|
-
style.
|
|
53
|
-
style.
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
props.sorted && props.asc ? React.createElement("div", { style: { position: 'absolute', width: 25 } }, gpa_symbols_1.SVGIcons.
|
|
81
|
-
React.createElement("div", { style: {
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
function ColumnDataWrapper(props) {
|
|
87
|
-
var css = (props.RowStyle !== undefined) ? __assign({}, props.RowStyle) : {};
|
|
88
|
-
if (props.width !== undefined && props.fixedLayout) {
|
|
89
|
-
css.width = props.width;
|
|
90
|
-
css.minWidth = props.width;
|
|
91
|
-
css.maxWidth = props.width;
|
|
92
|
-
css.overflowX = 'hidden';
|
|
93
|
-
css.display = 'inline-block';
|
|
94
|
-
}
|
|
95
|
-
if (props.dragStart !== undefined)
|
|
96
|
-
css.cursor = "grab";
|
|
97
|
-
var getFieldValue = function () { return props.Field !== undefined ? props.item[props.Field] : null; };
|
|
98
|
-
var getFieldContent = function () { return props.Content !== undefined ? props.Content({
|
|
99
|
-
item: props.item,
|
|
100
|
-
key: props.Key,
|
|
101
|
-
field: props.Field,
|
|
102
|
-
style: css,
|
|
103
|
-
index: props.index
|
|
104
|
-
}) : getFieldValue(); };
|
|
105
|
-
var onClick = React.useCallback(function (e) {
|
|
106
|
-
if (props.onClick !== undefined)
|
|
107
|
-
props.onClick({
|
|
108
|
-
colKey: props.Key,
|
|
109
|
-
colField: props.Field,
|
|
110
|
-
row: props.item,
|
|
111
|
-
data: getFieldValue(),
|
|
112
|
-
index: props.index
|
|
113
|
-
}, e);
|
|
114
|
-
}, [props.Key, props.Field, props.item, props.index, props.onClick]);
|
|
115
|
-
return (React.createElement("td", { style: css, onClick: onClick, draggable: props.dragStart !== undefined, onDragStart: function (e) {
|
|
116
|
-
props.dragStart({
|
|
117
|
-
colKey: props.Key,
|
|
118
|
-
colField: props.Field,
|
|
119
|
-
row: props.item,
|
|
120
|
-
data: getFieldValue(),
|
|
121
|
-
index: props.index
|
|
122
|
-
}, e);
|
|
123
|
-
} }, getFieldContent()));
|
|
124
|
-
}
|
|
125
|
-
exports.ColumnDataWrapper = ColumnDataWrapper;
|
|
1
|
+
"use strict";
|
|
2
|
+
// ******************************************************************************************************
|
|
3
|
+
// Column.tsx - Gbtc
|
|
4
|
+
//
|
|
5
|
+
// Copyright © 2018, Grid Protection Alliance. All Rights Reserved.
|
|
6
|
+
//
|
|
7
|
+
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
|
8
|
+
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
|
9
|
+
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
|
10
|
+
// file except in compliance with the License. You may obtain a copy of the License at:
|
|
11
|
+
//
|
|
12
|
+
// http://opensource.org/licenses/MIT
|
|
13
|
+
//
|
|
14
|
+
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
|
15
|
+
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
|
16
|
+
// License for the specific language governing permissions and limitations.
|
|
17
|
+
//
|
|
18
|
+
// Code Modification History:
|
|
19
|
+
// ----------------------------------------------------------------------------------------------------
|
|
20
|
+
// 08/02/2018 - Billy Ernest
|
|
21
|
+
// Generated original version of source code.
|
|
22
|
+
//
|
|
23
|
+
// ******************************************************************************************************
|
|
24
|
+
var __assign = (this && this.__assign) || function () {
|
|
25
|
+
__assign = Object.assign || function(t) {
|
|
26
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
27
|
+
s = arguments[i];
|
|
28
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
29
|
+
t[p] = s[p];
|
|
30
|
+
}
|
|
31
|
+
return t;
|
|
32
|
+
};
|
|
33
|
+
return __assign.apply(this, arguments);
|
|
34
|
+
};
|
|
35
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
|
+
exports.default = Column;
|
|
37
|
+
exports.ColumnHeaderWrapper = ColumnHeaderWrapper;
|
|
38
|
+
exports.ColumnDataWrapper = ColumnDataWrapper;
|
|
39
|
+
var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
|
|
40
|
+
var helper_functions_1 = require("@gpa-gemstone/helper-functions");
|
|
41
|
+
var React = require("react");
|
|
42
|
+
function Column(props) {
|
|
43
|
+
return React.createElement(React.Fragment, null, props.children);
|
|
44
|
+
}
|
|
45
|
+
function ColumnHeaderWrapper(props) {
|
|
46
|
+
var _a, _b;
|
|
47
|
+
var thref = React.useRef(null);
|
|
48
|
+
var style = (props.RowStyle !== undefined) ? __assign({}, props.HeaderStyle) : {};
|
|
49
|
+
if (props.width !== undefined && props.fixedLayout) {
|
|
50
|
+
style.width = props.width;
|
|
51
|
+
style.minWidth = props.width;
|
|
52
|
+
style.maxWidth = props.width;
|
|
53
|
+
style.overflowX = 'hidden';
|
|
54
|
+
style.display = 'inline-block';
|
|
55
|
+
}
|
|
56
|
+
if (style.cursor === undefined && ((_a = props.AllowSort) !== null && _a !== void 0 ? _a : true)) {
|
|
57
|
+
style.cursor = 'pointer';
|
|
58
|
+
}
|
|
59
|
+
if (style.position === undefined) {
|
|
60
|
+
style.position = 'relative';
|
|
61
|
+
}
|
|
62
|
+
if (style.borderTop === undefined) {
|
|
63
|
+
style.borderTop = 'none';
|
|
64
|
+
}
|
|
65
|
+
React.useLayoutEffect(function () {
|
|
66
|
+
var _a;
|
|
67
|
+
if (thref.current == null || props.width !== undefined)
|
|
68
|
+
return;
|
|
69
|
+
var w = (_a = (0, helper_functions_1.GetNodeSize)(thref.current)) === null || _a === void 0 ? void 0 : _a.width;
|
|
70
|
+
if (w === undefined)
|
|
71
|
+
return;
|
|
72
|
+
props.setWidth(w);
|
|
73
|
+
});
|
|
74
|
+
var onClick = React.useCallback(function (e) {
|
|
75
|
+
var _a;
|
|
76
|
+
if ((_a = props.AllowSort) !== null && _a !== void 0 ? _a : true)
|
|
77
|
+
props.onSort(props.Key, e, props.Field);
|
|
78
|
+
}, [props.onSort, props.AllowSort]);
|
|
79
|
+
return React.createElement("th", { ref: thref, style: style, onClick: onClick, onDrag: function (e) { e.stopPropagation(); } },
|
|
80
|
+
props.sorted && !props.asc ? React.createElement("div", { style: { position: 'absolute', width: 25 } }, gpa_symbols_1.SVGIcons.ArrowDropDown) : null,
|
|
81
|
+
props.sorted && props.asc ? React.createElement("div", { style: { position: 'absolute', width: 25 } }, gpa_symbols_1.SVGIcons.ArrowDropUp) : null,
|
|
82
|
+
React.createElement("div", { style: {
|
|
83
|
+
marginLeft: (props.sorted ? 25 : 0),
|
|
84
|
+
} }, (_b = props.children) !== null && _b !== void 0 ? _b : props.Key));
|
|
85
|
+
}
|
|
86
|
+
function ColumnDataWrapper(props) {
|
|
87
|
+
var css = (props.RowStyle !== undefined) ? __assign({}, props.RowStyle) : {};
|
|
88
|
+
if (props.width !== undefined && props.fixedLayout) {
|
|
89
|
+
css.width = props.width;
|
|
90
|
+
css.minWidth = props.width;
|
|
91
|
+
css.maxWidth = props.width;
|
|
92
|
+
css.overflowX = 'hidden';
|
|
93
|
+
css.display = 'inline-block';
|
|
94
|
+
}
|
|
95
|
+
if (props.dragStart !== undefined)
|
|
96
|
+
css.cursor = "grab";
|
|
97
|
+
var getFieldValue = function () { return props.Field !== undefined ? props.item[props.Field] : null; };
|
|
98
|
+
var getFieldContent = function () { return props.Content !== undefined ? props.Content({
|
|
99
|
+
item: props.item,
|
|
100
|
+
key: props.Key,
|
|
101
|
+
field: props.Field,
|
|
102
|
+
style: css,
|
|
103
|
+
index: props.index
|
|
104
|
+
}) : getFieldValue(); };
|
|
105
|
+
var onClick = React.useCallback(function (e) {
|
|
106
|
+
if (props.onClick !== undefined)
|
|
107
|
+
props.onClick({
|
|
108
|
+
colKey: props.Key,
|
|
109
|
+
colField: props.Field,
|
|
110
|
+
row: props.item,
|
|
111
|
+
data: getFieldValue(),
|
|
112
|
+
index: props.index
|
|
113
|
+
}, e);
|
|
114
|
+
}, [props.Key, props.Field, props.item, props.index, props.onClick]);
|
|
115
|
+
return (React.createElement("td", { style: css, onClick: onClick, draggable: props.dragStart !== undefined, onDragStart: function (e) {
|
|
116
|
+
props.dragStart({
|
|
117
|
+
colKey: props.Key,
|
|
118
|
+
colField: props.Field,
|
|
119
|
+
row: props.item,
|
|
120
|
+
data: getFieldValue(),
|
|
121
|
+
index: props.index
|
|
122
|
+
}, e);
|
|
123
|
+
} }, getFieldContent()));
|
|
124
|
+
}
|
package/lib/DynamicTable.d.ts
CHANGED
|
@@ -1,37 +1,37 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
export interface DynamicTableProps<T> {
|
|
3
|
-
/**
|
|
4
|
-
* List of T objects used to generate rows
|
|
5
|
-
*/
|
|
6
|
-
data: T[];
|
|
7
|
-
onClick: (data: {
|
|
8
|
-
colKey: string;
|
|
9
|
-
colField?: keyof T;
|
|
10
|
-
row: T;
|
|
11
|
-
data: T[keyof T] | null;
|
|
12
|
-
index: number;
|
|
13
|
-
}, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
14
|
-
/**
|
|
15
|
-
* Key of the collumn to sort by
|
|
16
|
-
*/
|
|
17
|
-
sortKey: string;
|
|
18
|
-
/**
|
|
19
|
-
* Boolen to indicate whether the sort is ascending or descending
|
|
20
|
-
*/
|
|
21
|
-
ascending: boolean;
|
|
22
|
-
onSort(data: {
|
|
23
|
-
colKey: string;
|
|
24
|
-
colField?: keyof T;
|
|
25
|
-
ascending: boolean;
|
|
26
|
-
}): void;
|
|
27
|
-
tableClass?: string;
|
|
28
|
-
tableStyle?: React.CSSProperties;
|
|
29
|
-
theadStyle?: React.CSSProperties;
|
|
30
|
-
theadClass?: string;
|
|
31
|
-
tbodyStyle?: React.CSSProperties;
|
|
32
|
-
tbodyClass?: string;
|
|
33
|
-
selected?(data: T): boolean;
|
|
34
|
-
rowStyle?: React.CSSProperties;
|
|
35
|
-
keySelector?: (data: T) => string;
|
|
36
|
-
}
|
|
37
|
-
export declare function DynamicTable<T>(props: DynamicTableProps<T>): JSX.Element | null;
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface DynamicTableProps<T extends object> {
|
|
3
|
+
/**
|
|
4
|
+
* List of T objects used to generate rows
|
|
5
|
+
*/
|
|
6
|
+
data: T[];
|
|
7
|
+
onClick: (data: {
|
|
8
|
+
colKey: string;
|
|
9
|
+
colField?: keyof T;
|
|
10
|
+
row: T;
|
|
11
|
+
data: T[keyof T] | null;
|
|
12
|
+
index: number;
|
|
13
|
+
}, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
14
|
+
/**
|
|
15
|
+
* Key of the collumn to sort by
|
|
16
|
+
*/
|
|
17
|
+
sortKey: string;
|
|
18
|
+
/**
|
|
19
|
+
* Boolen to indicate whether the sort is ascending or descending
|
|
20
|
+
*/
|
|
21
|
+
ascending: boolean;
|
|
22
|
+
onSort(data: {
|
|
23
|
+
colKey: string;
|
|
24
|
+
colField?: keyof T;
|
|
25
|
+
ascending: boolean;
|
|
26
|
+
}): void;
|
|
27
|
+
tableClass?: string;
|
|
28
|
+
tableStyle?: React.CSSProperties;
|
|
29
|
+
theadStyle?: React.CSSProperties;
|
|
30
|
+
theadClass?: string;
|
|
31
|
+
tbodyStyle?: React.CSSProperties;
|
|
32
|
+
tbodyClass?: string;
|
|
33
|
+
selected?(data: T): boolean;
|
|
34
|
+
rowStyle?: React.CSSProperties;
|
|
35
|
+
keySelector?: (data: T) => string;
|
|
36
|
+
}
|
|
37
|
+
export declare function DynamicTable<T extends object>(props: DynamicTableProps<T>): JSX.Element | null;
|
package/lib/DynamicTable.js
CHANGED
|
@@ -1,46 +1,45 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
// ******************************************************************************************************
|
|
3
|
-
// DynamicTable.tsx - Gbtc
|
|
4
|
-
//
|
|
5
|
-
// Copyright © 2021, Grid Protection Alliance. All Rights Reserved.
|
|
6
|
-
//
|
|
7
|
-
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
|
8
|
-
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
|
9
|
-
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
|
10
|
-
// file except in compliance with the License. You may obtain a copy of the License at:
|
|
11
|
-
//
|
|
12
|
-
// http://opensource.org/licenses/MIT
|
|
13
|
-
//
|
|
14
|
-
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
|
15
|
-
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
|
16
|
-
// License for the specific language governing permissions and limitations.
|
|
17
|
-
//
|
|
18
|
-
// Code Modification History:
|
|
19
|
-
// ----------------------------------------------------------------------------------------------------
|
|
20
|
-
// 07/26/2021 - Billy Ernest
|
|
21
|
-
// Generated original version of source code.
|
|
22
|
-
//
|
|
23
|
-
// ******************************************************************************************************
|
|
24
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
|
-
exports.DynamicTable =
|
|
26
|
-
var React = require("react");
|
|
27
|
-
var Table_1 = require("./Table");
|
|
28
|
-
var empty = new Map();
|
|
29
|
-
function DynamicTable(props) {
|
|
30
|
-
if (props.data.length <= 0)
|
|
31
|
-
return null;
|
|
32
|
-
var cols = [];
|
|
33
|
-
var keys = Object.keys(props.data[0]);
|
|
34
|
-
for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {
|
|
35
|
-
var key = keys_1[_i];
|
|
36
|
-
cols.push({ key: key, label: key, field: key });
|
|
37
|
-
}
|
|
38
|
-
return (React.createElement("table", { className: props.tableClass !== undefined ? props.tableClass : '', style: props.tableStyle },
|
|
39
|
-
React.createElement(Table_1.Header, { Class: props.theadClass, Style: props.theadStyle, Cols: cols, SortKey: props.sortKey, Ascending: props.ascending, Click: function (d) { return handleSort(d); } }),
|
|
40
|
-
React.createElement(Table_1.Rows, { Data: props.data, Cols: cols, RowStyle: props.rowStyle, BodyStyle: props.tbodyStyle, BodyClass: props.tbodyClass, Click: function (data, e) { return props.onClick(data, e); }, Selected: props.selected, KeySelector: props.keySelector })));
|
|
41
|
-
function handleSort(data) {
|
|
42
|
-
if (data.colKey !== null)
|
|
43
|
-
props.onSort(data);
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
exports.DynamicTable = DynamicTable;
|
|
1
|
+
"use strict";
|
|
2
|
+
// ******************************************************************************************************
|
|
3
|
+
// DynamicTable.tsx - Gbtc
|
|
4
|
+
//
|
|
5
|
+
// Copyright © 2021, Grid Protection Alliance. All Rights Reserved.
|
|
6
|
+
//
|
|
7
|
+
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
|
8
|
+
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
|
9
|
+
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
|
10
|
+
// file except in compliance with the License. You may obtain a copy of the License at:
|
|
11
|
+
//
|
|
12
|
+
// http://opensource.org/licenses/MIT
|
|
13
|
+
//
|
|
14
|
+
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
|
15
|
+
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
|
16
|
+
// License for the specific language governing permissions and limitations.
|
|
17
|
+
//
|
|
18
|
+
// Code Modification History:
|
|
19
|
+
// ----------------------------------------------------------------------------------------------------
|
|
20
|
+
// 07/26/2021 - Billy Ernest
|
|
21
|
+
// Generated original version of source code.
|
|
22
|
+
//
|
|
23
|
+
// ******************************************************************************************************
|
|
24
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
|
+
exports.DynamicTable = DynamicTable;
|
|
26
|
+
var React = require("react");
|
|
27
|
+
var Table_1 = require("./Table");
|
|
28
|
+
var empty = new Map();
|
|
29
|
+
function DynamicTable(props) {
|
|
30
|
+
if (props.data.length <= 0)
|
|
31
|
+
return null;
|
|
32
|
+
var cols = [];
|
|
33
|
+
var keys = Object.keys(props.data[0]);
|
|
34
|
+
for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {
|
|
35
|
+
var key = keys_1[_i];
|
|
36
|
+
cols.push({ key: key, label: key, field: key });
|
|
37
|
+
}
|
|
38
|
+
return (React.createElement("table", { className: props.tableClass !== undefined ? props.tableClass : '', style: props.tableStyle },
|
|
39
|
+
React.createElement(Table_1.Header, { Class: props.theadClass, Style: props.theadStyle, Cols: cols, SortKey: props.sortKey, Ascending: props.ascending, Click: function (d) { return handleSort(d); } }),
|
|
40
|
+
React.createElement(Table_1.Rows, { Data: props.data, Cols: cols, RowStyle: props.rowStyle, BodyStyle: props.tbodyStyle, BodyClass: props.tbodyClass, Click: function (data, e) { return props.onClick(data, e); }, Selected: props.selected, KeySelector: props.keySelector })));
|
|
41
|
+
function handleSort(data) {
|
|
42
|
+
if (data.colKey !== null)
|
|
43
|
+
props.onSort(data);
|
|
44
|
+
}
|
|
45
|
+
}
|
package/lib/Paging.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
export default function (props: IProps): JSX.Element;
|
|
1
|
+
export interface IProps {
|
|
2
|
+
Current: number;
|
|
3
|
+
Total: number;
|
|
4
|
+
SetPage: (p: number) => void;
|
|
5
|
+
}
|
|
6
|
+
export default function (props: IProps): JSX.Element;
|