@visns-studio/visns-components 5.1.0 → 5.1.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.
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"dependencies": {
|
|
3
3
|
"@emotion/is-prop-valid": "^1.3.1",
|
|
4
|
-
"@fontsource/barlow": "^5.1.
|
|
4
|
+
"@fontsource/barlow": "^5.1.1",
|
|
5
5
|
"@inovua/reactdatagrid-community": "^5.10.2",
|
|
6
6
|
"@inovua/reactdatagrid-enterprise": "^5.10.2",
|
|
7
7
|
"@nivo/bar": "^0.88.0",
|
|
@@ -9,17 +9,17 @@
|
|
|
9
9
|
"@nivo/line": "^0.88.0",
|
|
10
10
|
"@nivo/pie": "^0.88.0",
|
|
11
11
|
"@tinymce/tinymce-react": "^5.1.1",
|
|
12
|
-
"@vitejs/plugin-react": "^4.3.
|
|
12
|
+
"@vitejs/plugin-react": "^4.3.4",
|
|
13
13
|
"add": "^2.0.6",
|
|
14
14
|
"akar-icons": "^1.9.31",
|
|
15
15
|
"array-move": "^4.0.0",
|
|
16
16
|
"awesome-debounce-promise": "^2.1.0",
|
|
17
|
-
"axios": "^1.7.
|
|
17
|
+
"axios": "^1.7.9",
|
|
18
18
|
"dayjs": "^1.11.13",
|
|
19
19
|
"fabric": "^6.5.4",
|
|
20
20
|
"file-saver": "^2.0.5",
|
|
21
|
-
"framer-motion": "^11.
|
|
22
|
-
"html-react-parser": "^5.
|
|
21
|
+
"framer-motion": "^11.18.2",
|
|
22
|
+
"html-react-parser": "^5.2.2",
|
|
23
23
|
"lodash": "^4.17.21",
|
|
24
24
|
"lodash.debounce": "^4.0.8",
|
|
25
25
|
"moment": "^2.30.1",
|
|
@@ -31,53 +31,53 @@
|
|
|
31
31
|
"react-color": "^2.19.3",
|
|
32
32
|
"react-confirm-alert": "^3.0.6",
|
|
33
33
|
"react-copy-to-clipboard": "^5.1.0",
|
|
34
|
-
"react-datepicker": "^7.
|
|
35
|
-
"react-dropzone": "^14.
|
|
34
|
+
"react-datepicker": "^7.6.0",
|
|
35
|
+
"react-dropzone": "^14.3.5",
|
|
36
36
|
"react-grid-gallery": "^1.0.1",
|
|
37
|
-
"react-number-format": "^5.4.
|
|
37
|
+
"react-number-format": "^5.4.3",
|
|
38
38
|
"react-password-strength-bar": "^0.4.1",
|
|
39
39
|
"react-promise-tracker": "^2.1.1",
|
|
40
40
|
"react-quill": "^2.0.0",
|
|
41
41
|
"react-reveal": "^1.2.2",
|
|
42
|
-
"react-router-dom": "^6.
|
|
42
|
+
"react-router-dom": "^6.28.2",
|
|
43
43
|
"react-select": "^5.9.0",
|
|
44
|
-
"react-signature-pad-wrapper": "^4.0
|
|
44
|
+
"react-signature-pad-wrapper": "^4.1.0",
|
|
45
45
|
"react-slugify": "^4.0.1",
|
|
46
46
|
"react-sortable-hoc": "^2.0.0",
|
|
47
47
|
"react-to-print": "^2.15.1",
|
|
48
48
|
"react-toastify": "^10.0.6",
|
|
49
49
|
"react-toggle": "^4.1.3",
|
|
50
50
|
"react-tooltip": "^5.28.0",
|
|
51
|
-
"react-window": "^1.8.
|
|
51
|
+
"react-window": "^1.8.11",
|
|
52
52
|
"reactjs-popup": "^2.0.6",
|
|
53
53
|
"style-loader": "^4.0.0",
|
|
54
54
|
"truncate": "^3.0.0",
|
|
55
55
|
"uuid": "^10.0.0",
|
|
56
56
|
"validator": "^13.12.0",
|
|
57
|
-
"vite": "^5.4.
|
|
57
|
+
"vite": "^5.4.14",
|
|
58
58
|
"yarn": "^1.22.22"
|
|
59
59
|
},
|
|
60
60
|
"devDependencies": {
|
|
61
|
-
"@babel/core": "^7.
|
|
61
|
+
"@babel/core": "^7.26.0",
|
|
62
62
|
"@babel/plugin-transform-runtime": "^7.25.9",
|
|
63
|
-
"@babel/preset-env": "^7.
|
|
64
|
-
"@babel/preset-react": "^7.
|
|
63
|
+
"@babel/preset-env": "^7.26.0",
|
|
64
|
+
"@babel/preset-react": "^7.26.3",
|
|
65
65
|
"babel-loader": "^9.2.1",
|
|
66
66
|
"copy-webpack-plugin": "^12.0.2",
|
|
67
67
|
"css-loader": "^7.1.2",
|
|
68
68
|
"css-minimizer-webpack-plugin": "^7.0.0",
|
|
69
|
-
"mini-css-extract-plugin": "^2.9.
|
|
69
|
+
"mini-css-extract-plugin": "^2.9.2",
|
|
70
70
|
"react": "^18.3.1",
|
|
71
71
|
"react-dom": "^18.3.1",
|
|
72
|
-
"sass": "^1.
|
|
73
|
-
"sass-loader": "^16.0.
|
|
72
|
+
"sass": "^1.83.4",
|
|
73
|
+
"sass-loader": "^16.0.4"
|
|
74
74
|
},
|
|
75
75
|
"peerDependencies": {
|
|
76
76
|
"react": "^17.0.0 || ^18.0.0",
|
|
77
77
|
"react-dom": "^17.0.0 || ^18.0.0"
|
|
78
78
|
},
|
|
79
79
|
"name": "@visns-studio/visns-components",
|
|
80
|
-
"version": "5.1.
|
|
80
|
+
"version": "5.1.2",
|
|
81
81
|
"description": "Various packages to assist in the development of our Custom Applications.",
|
|
82
82
|
"main": "src/index.js",
|
|
83
83
|
"files": [
|
|
@@ -265,6 +265,19 @@ const GenericEditableTable = ({
|
|
|
265
265
|
options={multiOptions}
|
|
266
266
|
/>
|
|
267
267
|
);
|
|
268
|
+
case 'total':
|
|
269
|
+
const subtotal = column.keys.reduce(
|
|
270
|
+
(sum, key) => sum + (parseFloat(entry[key]) || 0),
|
|
271
|
+
0
|
|
272
|
+
);
|
|
273
|
+
|
|
274
|
+
// Format the subtotal as currency
|
|
275
|
+
const formattedSubtotal = new Intl.NumberFormat('en-AU', {
|
|
276
|
+
style: 'currency',
|
|
277
|
+
currency: 'AUD',
|
|
278
|
+
}).format(subtotal);
|
|
279
|
+
|
|
280
|
+
return formattedSubtotal;
|
|
268
281
|
default:
|
|
269
282
|
return (
|
|
270
283
|
<input
|
|
@@ -340,7 +353,7 @@ const GenericEditableTable = ({
|
|
|
340
353
|
<div className={styles.tdactions}>
|
|
341
354
|
{idx > 0 && (
|
|
342
355
|
<ArrowUp
|
|
343
|
-
size={
|
|
356
|
+
size={16}
|
|
344
357
|
onClick={() =>
|
|
345
358
|
handleSortChange(
|
|
346
359
|
group.id,
|
|
@@ -357,7 +370,7 @@ const GenericEditableTable = ({
|
|
|
357
370
|
group.entries.length -
|
|
358
371
|
1 && (
|
|
359
372
|
<ArrowDown
|
|
360
|
-
size={
|
|
373
|
+
size={16}
|
|
361
374
|
onClick={() =>
|
|
362
375
|
handleSortChange(
|
|
363
376
|
group.id,
|
|
@@ -371,7 +384,7 @@ const GenericEditableTable = ({
|
|
|
371
384
|
/>
|
|
372
385
|
)}
|
|
373
386
|
<TrashCan
|
|
374
|
-
size={
|
|
387
|
+
size={16}
|
|
375
388
|
onClick={() =>
|
|
376
389
|
handleDeleteRow(entry)
|
|
377
390
|
}
|
|
@@ -383,6 +396,43 @@ const GenericEditableTable = ({
|
|
|
383
396
|
</td>
|
|
384
397
|
</tr>
|
|
385
398
|
))}
|
|
399
|
+
<tr className={styles.subtotalRow}>
|
|
400
|
+
{columns.map((column, index) => (
|
|
401
|
+
<td key={column.id}>
|
|
402
|
+
{index === columns.length - 1
|
|
403
|
+
? // Total column: Calculate the sum of each row's total
|
|
404
|
+
group.entries
|
|
405
|
+
.reduce((sum, entry) => {
|
|
406
|
+
// For each row, sum the values based on column.keys
|
|
407
|
+
const subtotal =
|
|
408
|
+
column.keys.reduce(
|
|
409
|
+
(
|
|
410
|
+
rowSum,
|
|
411
|
+
key
|
|
412
|
+
) =>
|
|
413
|
+
rowSum +
|
|
414
|
+
(parseFloat(
|
|
415
|
+
entry[
|
|
416
|
+
key
|
|
417
|
+
]
|
|
418
|
+
) || 0),
|
|
419
|
+
0
|
|
420
|
+
);
|
|
421
|
+
return sum + subtotal;
|
|
422
|
+
}, 0)
|
|
423
|
+
.toLocaleString('en-AU', {
|
|
424
|
+
style: 'currency',
|
|
425
|
+
currency: 'AUD',
|
|
426
|
+
})
|
|
427
|
+
: index === columns.length - 2
|
|
428
|
+
? // The column immediately before 'total' shows 'Subtotal'
|
|
429
|
+
'Subtotal'
|
|
430
|
+
: // All other columns are left empty
|
|
431
|
+
''}
|
|
432
|
+
</td>
|
|
433
|
+
))}
|
|
434
|
+
<td></td>
|
|
435
|
+
</tr>
|
|
386
436
|
</React.Fragment>
|
|
387
437
|
))}
|
|
388
438
|
</tbody>
|
|
@@ -5,15 +5,18 @@
|
|
|
5
5
|
|
|
6
6
|
th,
|
|
7
7
|
td {
|
|
8
|
-
padding: 0.
|
|
8
|
+
padding: 0.25rem;
|
|
9
9
|
text-align: left;
|
|
10
10
|
border: 1px solid rgba(var(--primary-rgb), 0.1);
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
th {
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
padding: 0.75rem 1rem; /* Add more padding for better spacing */
|
|
15
|
+
font-size: 1.1rem; /* Increase font size */
|
|
16
16
|
font-weight: bold;
|
|
17
|
+
background-color: var(--primary-color); /* Apply a background color */
|
|
18
|
+
color: white; /* Change text color to white */
|
|
19
|
+
text-align: center;
|
|
17
20
|
}
|
|
18
21
|
|
|
19
22
|
td {
|
|
@@ -22,11 +25,16 @@
|
|
|
22
25
|
}
|
|
23
26
|
|
|
24
27
|
.categoryRow {
|
|
25
|
-
background-color: rgba(
|
|
26
|
-
|
|
28
|
+
background-color: rgba(
|
|
29
|
+
var(--primary-rgb),
|
|
30
|
+
0.15
|
|
31
|
+
); /* Lighter background for category */
|
|
32
|
+
font-size: 1.1rem; /* Increase font size */
|
|
27
33
|
font-weight: bold;
|
|
28
|
-
|
|
29
|
-
|
|
34
|
+
text-align: left;
|
|
35
|
+
padding: 0.75rem 1rem; /* Add padding for better spacing */
|
|
36
|
+
border-bottom: 2px solid var(--primary-color); /* Add border under category row */
|
|
37
|
+
color: var(--primary-color); /* Set text color to primary color */
|
|
30
38
|
}
|
|
31
39
|
|
|
32
40
|
.totalRow {
|
|
@@ -147,12 +155,12 @@
|
|
|
147
155
|
display: flex;
|
|
148
156
|
align-items: center;
|
|
149
157
|
position: relative;
|
|
150
|
-
width:
|
|
151
|
-
height:
|
|
158
|
+
width: 16px;
|
|
159
|
+
height: 16px;
|
|
152
160
|
|
|
153
161
|
svg {
|
|
154
|
-
width:
|
|
155
|
-
height:
|
|
162
|
+
width: 16px;
|
|
163
|
+
height: 16px;
|
|
156
164
|
}
|
|
157
165
|
}
|
|
158
166
|
}
|
|
@@ -176,3 +184,16 @@
|
|
|
176
184
|
background-color: rgba(var(--primary-rgb), 0.05);
|
|
177
185
|
border-color: rgba(var(--primary-rgb), 0.2);
|
|
178
186
|
}
|
|
187
|
+
|
|
188
|
+
.subtotalRow {
|
|
189
|
+
background-color: rgba(
|
|
190
|
+
var(--secondary-rgb),
|
|
191
|
+
0.15
|
|
192
|
+
); /* Lighter background for subtotal */
|
|
193
|
+
font-weight: bold;
|
|
194
|
+
text-align: right; /* Align to the right like total column */
|
|
195
|
+
padding: 1em; /* Add padding for better spacing */
|
|
196
|
+
font-size: 0.9rem; /* Increase font size */
|
|
197
|
+
color: var(--primary-color); /* Set text color to primary color */
|
|
198
|
+
border-top: 2px solid var(--primary-color); /* Add border top to separate subtotal row */
|
|
199
|
+
}
|