dce-reactkit 3.5.14 → 3.6.2

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 (31) hide show
  1. package/dist/cjs/index.js +388 -298
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/types/client/initClient.d.ts +7 -0
  4. package/dist/cjs/types/components/AppWrapper.d.ts +2 -3
  5. package/dist/esm/index.js +388 -298
  6. package/dist/esm/index.js.map +1 -1
  7. package/dist/esm/types/client/initClient.d.ts +7 -0
  8. package/dist/esm/types/components/AppWrapper.d.ts +2 -3
  9. package/dist/index.d.ts +2 -2
  10. package/package.json +1 -1
  11. package/src/client/initClient.tsx +20 -4
  12. package/src/components/AppWrapper.tsx +57 -13
  13. package/src/components/ButtonInputGroup.tsx +6 -6
  14. package/src/components/CSVDownloadButton.tsx +6 -6
  15. package/src/components/CheckboxButton.tsx +19 -8
  16. package/src/components/CopiableBox.tsx +8 -8
  17. package/src/components/Drawer.tsx +7 -7
  18. package/src/components/ErrorBox.tsx +5 -5
  19. package/src/components/IntelliTable.tsx +135 -135
  20. package/src/components/ItemPicker/NestableItemList.tsx +7 -7
  21. package/src/components/ItemPicker/index.tsx +7 -7
  22. package/src/components/LoadingSpinner.tsx +4 -4
  23. package/src/components/LogReviewer.tsx +21 -22
  24. package/src/components/Modal.tsx +163 -75
  25. package/src/components/PopFailureMark.tsx +7 -7
  26. package/src/components/PopPendingMark.tsx +7 -7
  27. package/src/components/PopSuccessMark.tsx +7 -7
  28. package/src/components/RadioButton.tsx +17 -8
  29. package/src/components/SimpleDateChooser.tsx +14 -13
  30. package/src/components/TabBox.tsx +7 -7
  31. package/src/helpers/genRouteHandler.ts +45 -41
package/src/components/IntelliTable.tsx CHANGED
@@ -34,7 +34,7 @@ import Variant from '../types/Variant';
34
34
  import { alert } from './AppWrapper';
35
35
 
36
36
  /*------------------------------------------------------------------------*/
37
- /* Types */
37
+ /* -------------------------------- Types ------------------------------- */
38
38
  /*------------------------------------------------------------------------*/
39
39
 
40
40
  // Props definition
@@ -65,7 +65,7 @@ enum SortType {
65
65
  }
66
66
 
67
67
  /*------------------------------------------------------------------------*/
68
- /* State */
68
+ /* -------------------------------- State ------------------------------- */
69
69
  /*------------------------------------------------------------------------*/
70
70
 
71
71
  /* -------- State Definition -------- */
@@ -197,12 +197,12 @@ const reducer = (state: State, action: Action): State => {
197
197
  };
198
198
 
199
199
  /*------------------------------------------------------------------------*/
200
- /* Component */
200
+ /* ------------------------------ Component ----------------------------- */
201
201
  /*------------------------------------------------------------------------*/
202
202
 
203
203
  const IntelliTable: React.FC<Props> = (props) => {
204
204
  /*------------------------------------------------------------------------*/
205
- /* Setup */
205
+ /* -------------------------------- Setup ------------------------------- */
206
206
  /*------------------------------------------------------------------------*/
207
207
 
208
208
  /* -------------- Props ------------- */
@@ -212,22 +212,22 @@ const IntelliTable: React.FC<Props> = (props) => {
212
212
  title,
213
213
  id,
214
214
  columns,
215
+ csvName,
216
+ data = [],
215
217
  } = props;
216
218
 
217
219
  // Get data, show empty row if none
218
- const data = (
219
- (props.data && props.data.length > 0)
220
- ? props.data
221
- : [{ id: 'empty-row' }]
222
- );
220
+ if (data.length === 0) {
221
+ data.push({ id: 'empty-row' });
222
+ }
223
223
 
224
224
  // Get CSV filename
225
225
  let filename = `${title}.csv`;
226
- if (props.csvName) {
226
+ if (csvName) {
227
227
  filename = (
228
- props.csvName.endsWith('.csv')
229
- ? props.csvName
230
- : `${props.csvName}.csv`
228
+ csvName.endsWith('.csv')
229
+ ? csvName
230
+ : `${csvName}.csv`
231
231
  );
232
232
  }
233
233
 
@@ -259,11 +259,11 @@ const IntelliTable: React.FC<Props> = (props) => {
259
259
  } = state;
260
260
 
261
261
  /*------------------------------------------------------------------------*/
262
- /* Render */
262
+ /* ------------------------------- Render ------------------------------- */
263
263
  /*------------------------------------------------------------------------*/
264
264
 
265
265
  /*----------------------------------------*/
266
- /* Modal */
266
+ /* ---------------- Modal --------------- */
267
267
  /*----------------------------------------*/
268
268
 
269
269
  // Modal that may be defined
@@ -287,7 +287,7 @@ const IntelliTable: React.FC<Props> = (props) => {
287
287
  if (noColumnsSelected) {
288
288
  return alert(
289
289
  'Choose at least one column',
290
- 'To continue, you have to choose at least one column to show'
290
+ 'To continue, you have to choose at least one column to show',
291
291
  );
292
292
  }
293
293
  dispatch({
@@ -348,13 +348,13 @@ const IntelliTable: React.FC<Props> = (props) => {
348
348
  }}
349
349
  >
350
350
  Deselect All
351
- </button >
351
+ </button>
352
352
  </Modal>
353
353
  );
354
354
  }
355
355
 
356
356
  /*----------------------------------------*/
357
- /* Main UI */
357
+ /* --------------- Main UI -------------- */
358
358
  /*----------------------------------------*/
359
359
 
360
360
  // Table header
@@ -440,7 +440,7 @@ const IntelliTable: React.FC<Props> = (props) => {
440
440
  );
441
441
 
442
442
  // Sort data
443
- let sortedData = [...data];
443
+ const sortedData = [...data];
444
444
  const paramType = columns.find((column) => {
445
445
  return (column.param === sortColumnParam);
446
446
  })?.type;
@@ -542,123 +542,123 @@ const IntelliTable: React.FC<Props> = (props) => {
542
542
  return columnVisibilityMap[column.param];
543
543
  })
544
544
  .map((column) => {
545
- // Get value
546
- let value: any = datum;
547
- const paramParts = column.param.split('.');
548
- paramParts.forEach((paramPart) => {
549
- value = (value ?? {})[paramPart];
550
- });
551
- let fullValue: React.ReactNode;
552
- let visibleValue: React.ReactNode;
553
- let title: string = '';
554
- if (column.type === ParamType.Boolean) {
555
- fullValue = !!(value);
556
- const noValue = (
557
- value === undefined
558
- || value === null
559
- );
560
- visibleValue = (
561
- noValue
562
- ? (
563
- <FontAwesomeIcon
564
- icon={faMinus}
565
- />
566
- )
567
- : (
568
- <FontAwesomeIcon
569
- icon={fullValue ? faCheckCircle : faXmarkCircle}
570
- />
571
- )
572
- );
573
- title = (fullValue ? 'True' : 'False');
574
- if (noValue) {
575
- title = 'Empty Cell';
576
- }
577
- } else if (column.type === ParamType.Int) {
578
- fullValue = Number.parseInt(value, 10);
579
- const noValue = Number.isNaN(fullValue);
580
- visibleValue = (
581
- noValue
582
- ? (
583
- <FontAwesomeIcon
584
- icon={faMinus}
585
- />
586
- )
587
- : fullValue
588
- );
589
- title = String(fullValue);
590
- if (noValue) {
591
- title = 'Empty Cell';
592
- }
593
- } else if (column.type === ParamType.Float) {
594
- fullValue = Number.parseFloat(value);
595
- const noValue = Number.isNaN(fullValue);
596
- visibleValue = (
597
- noValue
598
- ? (
599
- <FontAwesomeIcon
600
- icon={faMinus}
601
- />
602
- )
603
- : roundToNumDecimals(fullValue as number, 2)
604
- );
605
- title = String(fullValue);
606
- if (noValue) {
607
- title = 'Empty Cell';
608
- }
609
- } else if (column.type === ParamType.String) {
610
- fullValue = String(value).trim();
611
- const noValue = (
612
- value === undefined
613
- || value === null
614
- || String(fullValue).trim().length === 0
615
- );
616
- visibleValue = (
617
- noValue
618
- ? (
619
- <FontAwesomeIcon
620
- icon={faMinus}
621
- />
622
- )
623
- : fullValue
624
- );
625
- title = `"${value}"`;
626
- if (noValue) {
627
- title = 'Empty Cell';
545
+ // Get value
546
+ let value: any = datum;
547
+ const paramParts = column.param.split('.');
548
+ paramParts.forEach((paramPart) => {
549
+ value = (value ?? {})[paramPart];
550
+ });
551
+ let fullValue: React.ReactNode;
552
+ let visibleValue: React.ReactNode;
553
+ let colTitle: string = '';
554
+ if (column.type === ParamType.Boolean) {
555
+ fullValue = !!(value);
556
+ const noValue = (
557
+ value === undefined
558
+ || value === null
559
+ );
560
+ visibleValue = (
561
+ noValue
562
+ ? (
563
+ <FontAwesomeIcon
564
+ icon={faMinus}
565
+ />
566
+ )
567
+ : (
568
+ <FontAwesomeIcon
569
+ icon={fullValue ? faCheckCircle : faXmarkCircle}
570
+ />
571
+ )
572
+ );
573
+ colTitle = (fullValue ? 'True' : 'False');
574
+ if (noValue) {
575
+ colTitle = 'Empty Cell';
576
+ }
577
+ } else if (column.type === ParamType.Int) {
578
+ fullValue = Number.parseInt(value, 10);
579
+ const noValue = Number.isNaN(fullValue);
580
+ visibleValue = (
581
+ noValue
582
+ ? (
583
+ <FontAwesomeIcon
584
+ icon={faMinus}
585
+ />
586
+ )
587
+ : fullValue
588
+ );
589
+ colTitle = String(fullValue);
590
+ if (noValue) {
591
+ colTitle = 'Empty Cell';
592
+ }
593
+ } else if (column.type === ParamType.Float) {
594
+ fullValue = Number.parseFloat(value);
595
+ const noValue = Number.isNaN(fullValue);
596
+ visibleValue = (
597
+ noValue
598
+ ? (
599
+ <FontAwesomeIcon
600
+ icon={faMinus}
601
+ />
602
+ )
603
+ : roundToNumDecimals(fullValue as number, 2)
604
+ );
605
+ colTitle = String(fullValue);
606
+ if (noValue) {
607
+ colTitle = 'Empty Cell';
608
+ }
609
+ } else if (column.type === ParamType.String) {
610
+ fullValue = String(value).trim();
611
+ const noValue = (
612
+ value === undefined
613
+ || value === null
614
+ || String(fullValue).trim().length === 0
615
+ );
616
+ visibleValue = (
617
+ noValue
618
+ ? (
619
+ <FontAwesomeIcon
620
+ icon={faMinus}
621
+ />
622
+ )
623
+ : fullValue
624
+ );
625
+ colTitle = `"${value}"`;
626
+ if (noValue) {
627
+ colTitle = 'Empty Cell';
628
+ }
629
+ } else if (column.type === ParamType.JSON) {
630
+ fullValue = JSON.stringify(value);
631
+ const noValue = (
632
+ Array.isArray(value)
633
+ ? (!value || value.length === 0)
634
+ : Object.keys(value ?? {}).length === 0
635
+ );
636
+ visibleValue = (
637
+ noValue
638
+ ? (
639
+ <FontAwesomeIcon
640
+ icon={faMinus}
641
+ />
642
+ )
643
+ : fullValue
644
+ );
645
+ colTitle = 'JSON Object';
628
646
  }
629
- } else if (column.type === ParamType.JSON) {
630
- fullValue = JSON.stringify(value);
631
- const noValue = (
632
- Array.isArray(value)
633
- ? (!value || value.length === 0)
634
- : Object.keys(value ?? {}).length === 0
635
- );
636
- visibleValue = (
637
- noValue
638
- ? (
639
- <FontAwesomeIcon
640
- icon={faMinus}
641
- />
642
- )
643
- : fullValue
644
- );
645
- title="JSON Object"
646
- }
647
647
 
648
- // Create UI
649
- return (
650
- <td
651
- key={`${datum.id}-${column.param}`}
652
- title={title}
653
- style={{
654
- borderRight: '0.05rem solid #555',
655
- borderLeft: '0.05rem solid #555',
656
- }}
657
- >
658
- {visibleValue}
659
- </td>
660
- );
661
- })
648
+ // Create UI
649
+ return (
650
+ <td
651
+ key={`${datum.id}-${column.param}`}
652
+ title={colTitle}
653
+ style={{
654
+ borderRight: '0.05rem solid #555',
655
+ borderLeft: '0.05rem solid #555',
656
+ }}
657
+ >
658
+ {visibleValue}
659
+ </td>
660
+ );
661
+ })
662
662
  );
663
663
 
664
664
  // Add cells to a row
@@ -758,7 +758,7 @@ const IntelliTable: React.FC<Props> = (props) => {
758
758
  };
759
759
 
760
760
  /*------------------------------------------------------------------------*/
761
- /* Wrap Up */
761
+ /* ------------------------------- Wrap Up ------------------------------ */
762
762
  /*------------------------------------------------------------------------*/
763
763
 
764
764
  // Export component
package/src/components/ItemPicker/NestableItemList.tsx CHANGED
@@ -22,7 +22,7 @@ import Variant from '../../types/Variant';
22
22
  import PickableItem from './types/PickableItem';
23
23
 
24
24
  /*------------------------------------------------------------------------*/
25
- /* Types */
25
+ /* -------------------------------- Types ------------------------------- */
26
26
  /*------------------------------------------------------------------------*/
27
27
 
28
28
  // Props definition
@@ -38,7 +38,7 @@ type Props = {
38
38
  };
39
39
 
40
40
  /*------------------------------------------------------------------------*/
41
- /* State */
41
+ /* -------------------------------- State ------------------------------- */
42
42
  /*------------------------------------------------------------------------*/
43
43
 
44
44
  /* -------- State Definition -------- */
@@ -92,12 +92,12 @@ const reducer = (state: State, action: Action): State => {
92
92
  };
93
93
 
94
94
  /*------------------------------------------------------------------------*/
95
- /* Component */
95
+ /* ------------------------------ Component ----------------------------- */
96
96
  /*------------------------------------------------------------------------*/
97
97
 
98
98
  const NestableItemList: React.FC<Props> = (props) => {
99
99
  /*------------------------------------------------------------------------*/
100
- /* Setup */
100
+ /* -------------------------------- Setup ------------------------------- */
101
101
  /*------------------------------------------------------------------------*/
102
102
 
103
103
  /* -------------- Props ------------- */
@@ -130,7 +130,7 @@ const NestableItemList: React.FC<Props> = (props) => {
130
130
  } = state;
131
131
 
132
132
  /*------------------------------------------------------------------------*/
133
- /* Component Functions */
133
+ /* ------------------------- Component Functions ------------------------ */
134
134
  /*------------------------------------------------------------------------*/
135
135
 
136
136
  /**
@@ -222,7 +222,7 @@ const NestableItemList: React.FC<Props> = (props) => {
222
222
  };
223
223
 
224
224
  /*------------------------------------------------------------------------*/
225
- /* Render */
225
+ /* ------------------------------- Render ------------------------------- */
226
226
  /*------------------------------------------------------------------------*/
227
227
 
228
228
  return (
@@ -299,7 +299,7 @@ const NestableItemList: React.FC<Props> = (props) => {
299
299
  };
300
300
 
301
301
  /*------------------------------------------------------------------------*/
302
- /* Wrap Up */
302
+ /* ------------------------------- Wrap Up ------------------------------ */
303
303
  /*------------------------------------------------------------------------*/
304
304
 
305
305
  // Export component
package/src/components/ItemPicker/index.tsx CHANGED
@@ -16,7 +16,7 @@ import PickableItem from './types/PickableItem';
16
16
  import NestableItemList from './NestableItemList';
17
17
 
18
18
  /*------------------------------------------------------------------------*/
19
- /* Types */
19
+ /* -------------------------------- Types ------------------------------- */
20
20
  /*------------------------------------------------------------------------*/
21
21
 
22
22
  // Props definition
@@ -36,12 +36,12 @@ type Props = {
36
36
  };
37
37
 
38
38
  /*------------------------------------------------------------------------*/
39
- /* Component */
39
+ /* ------------------------------ Component ----------------------------- */
40
40
  /*------------------------------------------------------------------------*/
41
41
 
42
42
  const ItemPicker: React.FC<Props> = (props) => {
43
43
  /*------------------------------------------------------------------------*/
44
- /* Setup */
44
+ /* -------------------------------- Setup ------------------------------- */
45
45
  /*------------------------------------------------------------------------*/
46
46
 
47
47
  /* -------------- Props ------------- */
@@ -55,15 +55,15 @@ const ItemPicker: React.FC<Props> = (props) => {
55
55
  } = props;
56
56
 
57
57
  /*------------------------------------------------------------------------*/
58
- /* Component Functions */
58
+ /* ------------------------- Component Functions ------------------------ */
59
59
  /*------------------------------------------------------------------------*/
60
60
 
61
61
  /*------------------------------------------------------------------------*/
62
- /* Render */
62
+ /* ------------------------------- Render ------------------------------- */
63
63
  /*------------------------------------------------------------------------*/
64
64
 
65
65
  /*----------------------------------------*/
66
- /* Main UI */
66
+ /* --------------- Main UI -------------- */
67
67
  /*----------------------------------------*/
68
68
 
69
69
  return (
@@ -82,7 +82,7 @@ const ItemPicker: React.FC<Props> = (props) => {
82
82
  };
83
83
 
84
84
  /*------------------------------------------------------------------------*/
85
- /* Wrap Up */
85
+ /* ------------------------------- Wrap Up ------------------------------ */
86
86
  /*------------------------------------------------------------------------*/
87
87
 
88
88
  // Export component
package/src/components/LoadingSpinner.tsx CHANGED
@@ -11,7 +11,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
11
11
  import { faCircle } from '@fortawesome/free-solid-svg-icons';
12
12
 
13
13
  /*------------------------------------------------------------------------*/
14
- /* Style */
14
+ /* -------------------------------- Style ------------------------------- */
15
15
  /*------------------------------------------------------------------------*/
16
16
 
17
17
  const style = `
@@ -85,12 +85,12 @@ const style = `
85
85
  `;
86
86
 
87
87
  /*------------------------------------------------------------------------*/
88
- /* Component */
88
+ /* ------------------------------ Component ----------------------------- */
89
89
  /*------------------------------------------------------------------------*/
90
90
 
91
91
  const LoadingSpinner = () => {
92
92
  /*------------------------------------------------------------------------*/
93
- /* Render */
93
+ /* ------------------------------- Render ------------------------------- */
94
94
  /*------------------------------------------------------------------------*/
95
95
 
96
96
  // Add all four blips to a container
@@ -118,7 +118,7 @@ const LoadingSpinner = () => {
118
118
  };
119
119
 
120
120
  /*------------------------------------------------------------------------*/
121
- /* Wrap Up */
121
+ /* ------------------------------- Wrap Up ------------------------------ */
122
122
  /*------------------------------------------------------------------------*/
123
123
 
124
124
  // Export component