@monolith-forensics/monolith-ui 1.3.21 → 1.3.24

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 (3) hide show
  1. package/dist/Table/TableProvider.js +156 -128
  2. package/dist/Table/types.d.ts +3 -2
  3. package/package.json +1 -1
package/dist/Table/TableProvider.js CHANGED
@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
10
10
  return t;
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
- import { createContext, useEffect, useMemo, useState } from "react";
13
+ import { createContext, useMemo, useState } from "react";
14
14
  import StateStorage from "./StateStorage";
15
15
  import { resolveColumnResize, syncColumnState } from "./Utils";
16
16
  import TableDefaults from "./TableDefaults";
@@ -54,6 +54,16 @@ const TableProvider = (_a) => {
54
54
  const getColumnState = (dataField) => {
55
55
  return columnState.find((col) => col.dataField === dataField);
56
56
  };
57
+ const updateColumnState = (columnState) => {
58
+ var _a;
59
+ setColumnState(columnState);
60
+ (_a = props.onColumnStateChange) === null || _a === void 0 ? void 0 : _a.call(props, columnState);
61
+ if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
62
+ if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
63
+ StateStorage.setColumnState(stateStorage.key, columnState);
64
+ }
65
+ }
66
+ };
57
67
  const handleColumnReorder = (dragColumn, dropColumn) => {
58
68
  var _a, _b, _c;
59
69
  if (!dragColumn || !dropColumn)
@@ -77,47 +87,73 @@ const TableProvider = (_a) => {
77
87
  return col;
78
88
  })
79
89
  .sort((a, b) => a.orderValue - b.orderValue);
80
- setColumnState(newColumnState);
90
+ updateColumnState(newColumnState);
81
91
  (_c = props.onColumnReorder) === null || _c === void 0 ? void 0 : _c.call(props, {
82
92
  columnState: newColumnState,
83
93
  column: dragColumn,
84
94
  });
85
95
  };
86
96
  const handleColumnHeaderClick = (column) => {
87
- var _a;
97
+ var _a, _b;
88
98
  if (props.enableSorting === true || column.enableSorting === true) {
89
- setSortState((prevSortState) => {
90
- var _a;
91
- let newSortState = {
92
- dataField: column.dataField,
93
- dir: "asc",
94
- };
95
- if ((prevSortState === null || prevSortState === void 0 ? void 0 : prevSortState.dataField) === column.dataField) {
96
- if (prevSortState.dir === "desc") {
97
- newSortState = null;
98
- }
99
- else {
100
- if (newSortState) {
101
- newSortState.dir = prevSortState.dir === "asc" ? "desc" : "asc";
102
- }
99
+ let newSortState = {
100
+ dataField: column.dataField,
101
+ dir: "asc",
102
+ };
103
+ if ((sortState === null || sortState === void 0 ? void 0 : sortState.dataField) === column.dataField) {
104
+ if (sortState.dir === "desc") {
105
+ newSortState = null;
106
+ }
107
+ else {
108
+ if (newSortState) {
109
+ newSortState.dir = sortState.dir === "asc" ? "desc" : "asc";
103
110
  }
104
111
  }
105
- (_a = props.onColumnHeaderClick) === null || _a === void 0 ? void 0 : _a.call(props, { column, sort: newSortState });
106
- return newSortState;
107
- });
112
+ }
113
+ (_a = props.onColumnHeaderClick) === null || _a === void 0 ? void 0 : _a.call(props, { column, sort: newSortState });
114
+ updateSortState(newSortState);
108
115
  }
109
116
  else {
110
- (_a = props.onColumnHeaderClick) === null || _a === void 0 ? void 0 : _a.call(props, { column, sort: null });
117
+ (_b = props.onColumnHeaderClick) === null || _b === void 0 ? void 0 : _b.call(props, { column, sort: null });
118
+ updateSortState(null);
111
119
  }
112
120
  };
113
121
  const handleFilterChange = (query) => {
114
122
  setFilterState(query);
123
+ if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
124
+ if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
125
+ StateStorage.setFilterState(stateStorage.key, filterState);
126
+ }
127
+ }
128
+ };
129
+ const updateSearchState = (searchState) => {
130
+ var _a, _b, _c;
131
+ setSearch(searchState);
132
+ (_c = (_b = (_a = props.tableMenuOptions) === null || _a === void 0 ? void 0 : _a.searchOptions) === null || _b === void 0 ? void 0 : _b.onSearch) === null || _c === void 0 ? void 0 : _c.call(_b, searchState);
133
+ if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
134
+ if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
135
+ StateStorage.setSearchState(stateStorage.key, searchState);
136
+ }
137
+ }
115
138
  };
116
139
  const runSearch = (searchText) => {
117
- setSearch(searchText);
140
+ updateSearchState(searchText);
118
141
  };
119
142
  const clearSearch = () => {
120
- setSearch("");
143
+ updateSearchState("");
144
+ };
145
+ const updateSortState = (sortState) => {
146
+ var _a, _b;
147
+ setSortState(sortState);
148
+ (_a = props.onSort) === null || _a === void 0 ? void 0 : _a.call(props, {
149
+ column: (_b = columnState.find((col) => col.dataField === (sortState === null || sortState === void 0 ? void 0 : sortState.dataField))) !== null && _b !== void 0 ? _b : {},
150
+ sort: sortState,
151
+ });
152
+ if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
153
+ if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
154
+ StateStorage.setSortState(stateStorage.key, sortState);
155
+ }
156
+ }
121
157
  };
122
158
  const sortData = (sortState) => {
123
159
  // sort data
@@ -316,14 +352,13 @@ const TableProvider = (_a) => {
316
352
  return processedData;
317
353
  };
318
354
  const toggleColumnVisibility = (dataField) => {
319
- setColumnState((prevColumnState) => {
320
- return prevColumnState.map((col) => {
321
- if (col.dataField === dataField) {
322
- return Object.assign(Object.assign({}, col), { visible: !col.visible });
323
- }
324
- return col;
325
- });
355
+ const newColumnState = columnState.map((col) => {
356
+ if (col.dataField === dataField) {
357
+ return Object.assign(Object.assign({}, col), { visible: !col.visible });
358
+ }
359
+ return col;
326
360
  });
361
+ updateColumnState(newColumnState);
327
362
  };
328
363
  const toggleCompact = () => {
329
364
  setCompactState((prev) => !prev);
@@ -332,45 +367,99 @@ const TableProvider = (_a) => {
332
367
  var _a;
333
368
  return (((_a = columnState.find((col) => col.dataField === dataField)) === null || _a === void 0 ? void 0 : _a.visible) || true);
334
369
  };
370
+ const saveSelectionState = (selectionState) => {
371
+ if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
372
+ if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
373
+ StateStorage.setSelectionState(stateStorage.key, selectionState);
374
+ }
375
+ }
376
+ };
335
377
  const selectRow = (row) => {
378
+ var _a;
336
379
  const key = !!props.keyField ? row[props.keyField] : row.__key;
337
380
  const keyField = !!props.keyField ? props.keyField : "__key";
381
+ const newSelectionState = {
382
+ selectedRowKeys,
383
+ excludedRowKeys,
384
+ selectionStatus,
385
+ };
338
386
  if (props.data.length === selectedRowKeys.length + 1) {
339
- setSelectionStatus(SelectionStatus.All);
387
+ newSelectionState.selectionStatus = SelectionStatus.All;
340
388
  }
341
389
  else {
342
- setSelectionStatus(SelectionStatus.SomeIncluded);
390
+ newSelectionState.selectionStatus = SelectionStatus.SomeIncluded;
343
391
  }
344
- setSelectedRowKeys((prevSelectedRowKeys) => {
345
- return [...prevSelectedRowKeys, key];
346
- });
347
- setExcludedRowKeys((prev) => prev.filter((k) => k !== key));
392
+ newSelectionState.selectedRowKeys = [
393
+ ...newSelectionState.selectedRowKeys,
394
+ key,
395
+ ];
396
+ newSelectionState.excludedRowKeys =
397
+ newSelectionState.excludedRowKeys.filter((k) => k !== key);
398
+ setSelectionStatus(newSelectionState.selectionStatus);
399
+ setSelectedRowKeys(newSelectionState.selectedRowKeys);
400
+ setExcludedRowKeys(newSelectionState.excludedRowKeys);
401
+ (_a = props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, newSelectionState);
402
+ saveSelectionState(newSelectionState);
348
403
  };
349
404
  const deselectRow = (row) => {
405
+ var _a;
350
406
  const key = !!props.keyField ? props.keyField : "__key";
407
+ const newSelectionState = {
408
+ selectedRowKeys,
409
+ excludedRowKeys,
410
+ selectionStatus,
411
+ };
351
412
  if (selectionStatus === SelectionStatus.All ||
352
413
  selectionStatus === SelectionStatus.SomeExcluded) {
353
- setSelectionStatus(SelectionStatus.SomeExcluded);
354
- setExcludedRowKeys((prev) => [...prev, row[key]]);
414
+ newSelectionState.selectionStatus = SelectionStatus.SomeExcluded;
415
+ newSelectionState.excludedRowKeys = [
416
+ ...newSelectionState.excludedRowKeys,
417
+ row[key],
418
+ ];
355
419
  }
356
420
  if (selectedRowKeys.length === 1) {
357
- setSelectionStatus(SelectionStatus.None);
421
+ newSelectionState.selectionStatus = SelectionStatus.None;
358
422
  }
359
- setSelectedRowKeys((prevSelectedRowKeys) => {
360
- return prevSelectedRowKeys.filter((k) => k !== row[key]);
361
- });
423
+ newSelectionState.selectedRowKeys =
424
+ newSelectionState.selectedRowKeys.filter((k) => k !== row[key]);
425
+ setSelectionStatus(newSelectionState.selectionStatus);
426
+ setSelectedRowKeys(newSelectionState.selectedRowKeys);
427
+ setExcludedRowKeys(newSelectionState.excludedRowKeys);
428
+ (_a = props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, newSelectionState);
429
+ saveSelectionState(newSelectionState);
362
430
  };
363
431
  const selectAllRows = () => {
364
- var _a;
432
+ var _a, _b;
365
433
  const keys = ((_a = props.data) === null || _a === void 0 ? void 0 : _a.map((row) => !!props.keyField ? row[props.keyField] : row.__key)) || [];
366
- setSelectedRowKeys(keys);
367
- setSelectionStatus(SelectionStatus.All);
368
- setExcludedRowKeys([]);
434
+ const newSelectionState = {
435
+ selectedRowKeys,
436
+ excludedRowKeys,
437
+ selectionStatus,
438
+ };
439
+ newSelectionState.selectedRowKeys = keys;
440
+ newSelectionState.excludedRowKeys = [];
441
+ newSelectionState.selectionStatus = SelectionStatus.All;
442
+ setSelectionStatus(newSelectionState.selectionStatus);
443
+ setSelectedRowKeys(newSelectionState.selectedRowKeys);
444
+ setExcludedRowKeys(newSelectionState.excludedRowKeys);
445
+ (_b = props.onSelectionChange) === null || _b === void 0 ? void 0 : _b.call(props, newSelectionState);
446
+ saveSelectionState(newSelectionState);
369
447
  };
370
448
  const clearSelections = () => {
371
- setSelectedRowKeys([]);
372
- setSelectionStatus(SelectionStatus.None);
373
- setExcludedRowKeys([]);
449
+ var _a;
450
+ const newSelectionState = {
451
+ selectedRowKeys,
452
+ excludedRowKeys,
453
+ selectionStatus,
454
+ };
455
+ newSelectionState.selectedRowKeys = [];
456
+ newSelectionState.excludedRowKeys = [];
457
+ newSelectionState.selectionStatus = SelectionStatus.None;
458
+ setSelectionStatus(newSelectionState.selectionStatus);
459
+ setSelectedRowKeys(newSelectionState.selectedRowKeys);
460
+ setExcludedRowKeys(newSelectionState.excludedRowKeys);
461
+ (_a = props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, newSelectionState);
462
+ saveSelectionState(newSelectionState);
374
463
  };
375
464
  const getSelectedRows = () => {
376
465
  return props.data.filter((row) => {
@@ -410,85 +499,24 @@ const TableProvider = (_a) => {
410
499
  return 0;
411
500
  }
412
501
  };
413
- useEffect(() => {
414
- var _a;
415
- (_a = props.onColumnStateChange) === null || _a === void 0 ? void 0 : _a.call(props, columnState);
416
- if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
417
- if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
418
- StateStorage.setColumnState(stateStorage.key, columnState);
419
- }
420
- }
421
- if (tableInstanceRef) {
422
- tableInstanceRef.current = {
423
- columnState,
424
- setColumnState,
425
- getColumnState,
426
- toggleColumnVisibility,
427
- getColumnVisibility,
428
- getSelectedRows,
429
- getSelectedRowKeys,
430
- selectRow,
431
- deselectRow,
432
- selectAllRows,
433
- clearSelections,
434
- runSearch,
435
- clearSearch,
436
- };
437
- }
438
- }, [columnState]);
439
- useEffect(() => {
440
- var _a;
441
- (_a = props === null || props === void 0 ? void 0 : props.onSelectionChange) === null || _a === void 0 ? void 0 : _a.call(props, {
442
- selectedRowKeys,
443
- excludedRowKeys,
444
- selectionStatus,
445
- });
446
- if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
447
- if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
448
- StateStorage.setSelectionState(stateStorage.key, {
449
- selectedRowKeys,
450
- excludedRowKeys,
451
- selectionStatus,
452
- });
453
- }
454
- }
455
- }, [
456
- selectedRowKeys,
457
- selectionStatus,
458
- excludedRowKeys,
459
- props === null || props === void 0 ? void 0 : props.onSelectionChange,
460
- stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled,
461
- stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type,
462
- stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.key,
463
- ]);
464
- useEffect(() => {
465
- var _a, _b;
466
- if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
467
- if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
468
- StateStorage.setSortState(stateStorage.key, sortState);
469
- }
470
- }
471
- (_a = props.onSort) === null || _a === void 0 ? void 0 : _a.call(props, {
472
- column: (_b = columnState.find((col) => col.dataField === (sortState === null || sortState === void 0 ? void 0 : sortState.dataField))) !== null && _b !== void 0 ? _b : {},
473
- sort: sortState,
474
- });
475
- }, [sortState]);
476
- useEffect(() => {
477
- var _a, _b, _c;
478
- if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
479
- if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
480
- StateStorage.setSearchState(stateStorage.key, search);
481
- }
482
- }
483
- (_c = (_b = (_a = props.tableMenuOptions) === null || _a === void 0 ? void 0 : _a.searchOptions) === null || _b === void 0 ? void 0 : _b.onSearch) === null || _c === void 0 ? void 0 : _c.call(_b, search);
484
- }, [search]);
485
- useEffect(() => {
486
- if (stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.enabled) {
487
- if ((stateStorage === null || stateStorage === void 0 ? void 0 : stateStorage.type) === "localStorage") {
488
- StateStorage.setFilterState(stateStorage.key, filterState);
489
- }
490
- }
491
- }, [filterState]);
502
+ if (tableInstanceRef) {
503
+ tableInstanceRef.current = {
504
+ columnState,
505
+ setColumnState: updateColumnState,
506
+ getColumnState,
507
+ toggleColumnVisibility,
508
+ getColumnVisibility,
509
+ getSelectedRows,
510
+ getSelectedRowKeys,
511
+ getSelectionTotal: getCalculatedSelectionTotal,
512
+ selectRow,
513
+ deselectRow,
514
+ selectAllRows,
515
+ clearSelections,
516
+ runSearch,
517
+ clearSearch,
518
+ };
519
+ }
492
520
  const _data = useMemo(() => {
493
521
  let processedData = props.data;
494
522
  if (props.manualSorting !== true) {
package/dist/Table/types.d.ts CHANGED
@@ -91,12 +91,12 @@ export type TableDimensions = {
91
91
  };
92
92
  export type TableContextType = {
93
93
  columnState: ColumnState[];
94
+ setColumnState: React.Dispatch<React.SetStateAction<ColumnState[]>>;
94
95
  sortState?: SortState | null;
95
96
  filterState?: Query | null;
96
97
  searchState?: string | null;
97
98
  data: any[];
98
99
  totalRecords?: number;
99
- setColumnState: React.Dispatch<React.SetStateAction<ColumnState[]>>;
100
100
  keyField?: string;
101
101
  tableHeight?: number;
102
102
  tableMaxHeight?: number;
@@ -307,7 +307,7 @@ export interface TableProps {
307
307
  }
308
308
  export type TableInstance = {
309
309
  columnState: ColumnState[];
310
- setColumnState: React.Dispatch<React.SetStateAction<ColumnState[]>>;
310
+ setColumnState: (e: ColumnState[]) => void;
311
311
  getColumnState: (dataField: string) => ColumnState | undefined;
312
312
  onColumnResize?: (e: OnColumnChangeProps) => void;
313
313
  onColumnReorder?: (e: OnColumnChangeProps) => void;
@@ -316,6 +316,7 @@ export type TableInstance = {
316
316
  getColumnVisibility: (dataField: string) => boolean;
317
317
  getSelectedRows: () => any[];
318
318
  getSelectedRowKeys: () => string[];
319
+ getSelectionTotal: () => number;
319
320
  selectRow: (row: any) => void;
320
321
  deselectRow: (row: any) => void;
321
322
  selectAllRows: () => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@monolith-forensics/monolith-ui",
3
- "version": "1.3.21",
3
+ "version": "1.3.24",
4
4
  "main": "./dist/index.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "author": "Matt Danner (Monolith Forensics LLC)",