@azrico/reactgrid 1.3.31 → 1.3.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.
Files changed (7) hide show
  1. package/dist/src/example.js +1 -0
  2. package/dist/src/themes/grid.css +31 -34
  3. package/dist/src/views/DataGrid.js +24 -1
  4. package/package.json +3 -3
  5. package/src/example.tsx +1 -0
  6. package/src/themes/grid.css +31 -34
  7. package/src/views/DataGrid.tsx +25 -2
package/dist/src/example.js CHANGED
@@ -141,6 +141,7 @@ function ExampleGrid() {
141
141
  }, []);
142
142
  return _react.default.createElement(_DataGrid.default, {
143
143
  delayedSize: true,
144
+ dark: true,
144
145
  // details_dataSource={details_dataSource}
145
146
  dataSource: dataSource,
146
147
  details_columns: columns,
package/dist/src/themes/grid.css CHANGED
@@ -1,53 +1,50 @@
1
- .InovuaReactDataGrid {
2
- --grid-bg: '#fff';
3
- color: black;
1
+ .InovuaReactDataGrid {
2
+
3
+
4
4
  z-index: 1000;
5
5
  font-family: 'Nunito Sans', 'Iran Sans', sans-serif;
6
6
  }
7
-
8
- .InovuaReactDataGrid__row {
9
- color: rgb(1, 1, 1);
7
+ .InovuaReactDataGrid--theme-amber-dark {
8
+ --grid-bg: #313943;
9
+ --grid-fg:#c5cae9;
10
+ --grid-fg-hover:#ececec;
10
11
  }
11
- .InovuaReactDataGrid__row--active {
12
- color: rgb(1, 1, 1);
12
+
13
+ .InovuaReactDataGrid--theme-default-light {
14
+ --grid-bg: #fff;
15
+ --grid-fg:#1e1e1e;
16
+ --grid-fg-hover:#000000;
17
+ }
18
+
19
+ .InovuaReactDataGrid__row{
20
+ color:var(--grid-fg);
13
21
  }
22
+
23
+
14
24
 
15
- .InovuaReactDataGrid__row-hover-target:hover {
16
- color: rgb(25, 25, 25) !important;
17
- }
18
-
19
- .inovua-react-toolkit-text-input {
20
- font-family: inherit;
21
- }
22
- .inovua-react-toolkit-text-input input {
23
- font-family: inherit;
24
- }
25
25
 
26
- /* --------------------------- selected row color --------------------------- */
27
- .InovuaReactDataGrid--theme-default-light
26
+ /* --------------------------- selected row color --------------------------- */
27
+ .InovuaReactDataGrid
28
28
  .InovuaReactDataGrid__row--active
29
29
  .InovuaReactDataGrid__cell:not(.InovuaReactDataGrid__cell--no-background),
30
- .InovuaReactDataGrid--theme-default-light
30
+ .InovuaReactDataGrid
31
31
  .InovuaReactDataGrid__row--active.InovuaReactDataGrid__row--even
32
32
  .InovuaReactDataGrid__cell:not(.InovuaReactDataGrid__cell--no-background),
33
- .InovuaReactDataGrid--theme-default-light
33
+ .InovuaReactDataGrid
34
34
  .InovuaReactDataGrid__row--active.InovuaReactDataGrid__row--odd
35
35
  .InovuaReactDataGrid__cell:not(.InovuaReactDataGrid__cell--no-background) {
36
- color: rgb(1, 1, 1);
37
- }
38
- /*
39
- .InovuaReactDataGrid {
40
- background: var(--grid-bg) !important;
36
+ color: var(--grid-fg-hover);
41
37
  }
42
- .InovuaReactDataGrid__header {
43
- background: var(--grid-bg) !important;
38
+
39
+ .inovua-react-toolkit-text-input {
40
+ font-family: inherit;
44
41
  }
45
- .InovuaReactDataGrid__row {
46
- background: var(--grid-bg) !important;
42
+ .inovua-react-toolkit-text-input input {
43
+ font-family: inherit;
47
44
  }
48
- .InovuaReactDataGrid__cell {
49
- background: var(--grid-bg) !important;
50
- } */
45
+
46
+
47
+
51
48
  .InovuaReactDataGrid__cell .InovuaReactDataGrid__cell__content {
52
49
  height: 100%;
53
50
  display: flex;
package/dist/src/views/DataGrid.js CHANGED
@@ -123,7 +123,30 @@ function DataGridEventsWrapper(props) {
123
123
  const click_data = _react.default.useRef(null);
124
124
  const [menuAnchorEl, set_menuAnchorEl] = _react.default.useState(null);
125
125
  const [menuRow, set_menuRow] = _react.default.useState(null);
126
- /* --------------------------------- events --------------------------------- */
126
+ /* -------------------------------------------------------------------------- */
127
+ /* refresh functions */
128
+ /* -------------------------------------------------------------------------- */
129
+ const refresh_column = _react.default.useCallback(col => {
130
+ const dt = props.gridRef.current.ungroupedData;
131
+ for (let index = 0; index < dt.length; index++) {
132
+ props.gridRef.current.setItemPropertyAt(index, col, dt[index][col]);
133
+ }
134
+ }, [props.gridRef]);
135
+ const refresh = _react.default.useCallback(() => {
136
+ const dt = props.gridRef.current.ungroupedData;
137
+ for (let index = 0; index < dt.length; index++) {
138
+ props.gridRef.current.setItemAt(index, {}, {
139
+ replace: false
140
+ });
141
+ }
142
+ }, [props.gridRef]);
143
+ _react.default.useEffect(() => {
144
+ props.gridRef.current['refresh'] = refresh;
145
+ props.gridRef.current['refresh_column'] = refresh_column;
146
+ }, [refresh, refresh_column]);
147
+ /* -------------------------------------------------------------------------- */
148
+ /* events */
149
+ /* -------------------------------------------------------------------------- */
127
150
  const onRowClick = _react.default.useCallback((rowProps, event) => {
128
151
  const nowDate = Date.now();
129
152
  const lastclick = click_data.current[(0, _func_grid.get_row_id)(rowProps)];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@azrico/reactgrid",
3
- "version": "1.3.31",
3
+ "version": "1.3.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.5.84",
33
- "@azrico/object": "^1.4.84",
32
+ "@azrico/controls": "^1.5.92",
33
+ "@azrico/object": "^1.4.97",
34
34
  "@emotion/react": "^11.9.3",
35
35
  "@emotion/styled": "^11.9.3",
36
36
  "@inovua/reactdatagrid-enterprise": "^5.10.2",
package/src/example.tsx CHANGED
@@ -130,6 +130,7 @@ export function ExampleGrid() {
130
130
  return (
131
131
  <AzGrid
132
132
  delayedSize
133
+ dark
133
134
  // details_dataSource={details_dataSource}
134
135
  dataSource={dataSource}
135
136
  details_columns={columns}
package/src/themes/grid.css CHANGED
@@ -1,53 +1,50 @@
1
- .InovuaReactDataGrid {
2
- --grid-bg: '#fff';
3
- color: black;
1
+ .InovuaReactDataGrid {
2
+
3
+
4
4
  z-index: 1000;
5
5
  font-family: 'Nunito Sans', 'Iran Sans', sans-serif;
6
6
  }
7
-
8
- .InovuaReactDataGrid__row {
9
- color: rgb(1, 1, 1);
7
+ .InovuaReactDataGrid--theme-amber-dark {
8
+ --grid-bg: #313943;
9
+ --grid-fg:#c5cae9;
10
+ --grid-fg-hover:#ececec;
10
11
  }
11
- .InovuaReactDataGrid__row--active {
12
- color: rgb(1, 1, 1);
12
+
13
+ .InovuaReactDataGrid--theme-default-light {
14
+ --grid-bg: #fff;
15
+ --grid-fg:#1e1e1e;
16
+ --grid-fg-hover:#000000;
17
+ }
18
+
19
+ .InovuaReactDataGrid__row{
20
+ color:var(--grid-fg);
13
21
  }
22
+
23
+
14
24
 
15
- .InovuaReactDataGrid__row-hover-target:hover {
16
- color: rgb(25, 25, 25) !important;
17
- }
18
-
19
- .inovua-react-toolkit-text-input {
20
- font-family: inherit;
21
- }
22
- .inovua-react-toolkit-text-input input {
23
- font-family: inherit;
24
- }
25
25
 
26
- /* --------------------------- selected row color --------------------------- */
27
- .InovuaReactDataGrid--theme-default-light
26
+ /* --------------------------- selected row color --------------------------- */
27
+ .InovuaReactDataGrid
28
28
  .InovuaReactDataGrid__row--active
29
29
  .InovuaReactDataGrid__cell:not(.InovuaReactDataGrid__cell--no-background),
30
- .InovuaReactDataGrid--theme-default-light
30
+ .InovuaReactDataGrid
31
31
  .InovuaReactDataGrid__row--active.InovuaReactDataGrid__row--even
32
32
  .InovuaReactDataGrid__cell:not(.InovuaReactDataGrid__cell--no-background),
33
- .InovuaReactDataGrid--theme-default-light
33
+ .InovuaReactDataGrid
34
34
  .InovuaReactDataGrid__row--active.InovuaReactDataGrid__row--odd
35
35
  .InovuaReactDataGrid__cell:not(.InovuaReactDataGrid__cell--no-background) {
36
- color: rgb(1, 1, 1);
37
- }
38
- /*
39
- .InovuaReactDataGrid {
40
- background: var(--grid-bg) !important;
36
+ color: var(--grid-fg-hover);
41
37
  }
42
- .InovuaReactDataGrid__header {
43
- background: var(--grid-bg) !important;
38
+
39
+ .inovua-react-toolkit-text-input {
40
+ font-family: inherit;
44
41
  }
45
- .InovuaReactDataGrid__row {
46
- background: var(--grid-bg) !important;
42
+ .inovua-react-toolkit-text-input input {
43
+ font-family: inherit;
47
44
  }
48
- .InovuaReactDataGrid__cell {
49
- background: var(--grid-bg) !important;
50
- } */
45
+
46
+
47
+
51
48
  .InovuaReactDataGrid__cell .InovuaReactDataGrid__cell__content {
52
49
  height: 100%;
53
50
  display: flex;
package/src/views/DataGrid.tsx CHANGED
@@ -274,8 +274,31 @@ function DataGridEventsWrapper(props: DataGridWrapperProps) {
274
274
  const [menuAnchorEl, set_menuAnchorEl] = React.useState<any>(null);
275
275
  const [menuRow, set_menuRow] = React.useState<any>(null);
276
276
 
277
- /* --------------------------------- events --------------------------------- */
278
-
277
+ /* -------------------------------------------------------------------------- */
278
+ /* refresh functions */
279
+ /* -------------------------------------------------------------------------- */
280
+ const refresh_column = React.useCallback(
281
+ (col: string) => {
282
+ const dt = props.gridRef.current.ungroupedData;
283
+ for (let index = 0; index < dt.length; index++) {
284
+ (props.gridRef.current as any).setItemPropertyAt(index, col, dt[index][col]);
285
+ }
286
+ },
287
+ [props.gridRef]
288
+ );
289
+ const refresh = React.useCallback(() => {
290
+ const dt = props.gridRef.current.ungroupedData;
291
+ for (let index = 0; index < dt.length; index++) {
292
+ (props.gridRef.current as any).setItemAt(index, {}, { replace: false });
293
+ }
294
+ }, [props.gridRef]);
295
+ React.useEffect(() => {
296
+ props.gridRef.current['refresh'] = refresh;
297
+ props.gridRef.current['refresh_column'] = refresh_column;
298
+ }, [refresh, refresh_column]);
299
+ /* -------------------------------------------------------------------------- */
300
+ /* events */
301
+ /* -------------------------------------------------------------------------- */
279
302
  const onRowClick = React.useCallback(
280
303
  (rowProps, event) => {
281
304
  const nowDate = Date.now();