@visns-studio/visns-components 5.9.13 → 5.10.0
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
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"@dnd-kit/sortable": "^10.0.0",
|
|
5
5
|
"@dnd-kit/utilities": "^3.2.2",
|
|
6
6
|
"@emotion/is-prop-valid": "^1.3.1",
|
|
7
|
-
"@fontsource/barlow": "^5.2.
|
|
7
|
+
"@fontsource/barlow": "^5.2.6",
|
|
8
8
|
"@inovua/reactdatagrid-community": "^5.10.2",
|
|
9
9
|
"@inovua/reactdatagrid-enterprise": "^5.10.2",
|
|
10
10
|
"@nivo/bar": "^0.99.0",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"awesome-debounce-promise": "^2.1.0",
|
|
23
23
|
"browser-image-compression": "^2.0.2",
|
|
24
24
|
"dayjs": "^1.11.13",
|
|
25
|
-
"fabric": "^6.
|
|
25
|
+
"fabric": "^6.7.0",
|
|
26
26
|
"file-saver": "^2.0.5",
|
|
27
27
|
"framer-motion": "^12.16.0",
|
|
28
28
|
"html-react-parser": "^5.2.5",
|
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
"react-dom": "^17.0.0 || ^18.0.0"
|
|
88
88
|
},
|
|
89
89
|
"name": "@visns-studio/visns-components",
|
|
90
|
-
"version": "5.
|
|
90
|
+
"version": "5.10.0",
|
|
91
91
|
"description": "Various packages to assist in the development of our Custom Applications.",
|
|
92
92
|
"main": "src/index.js",
|
|
93
93
|
"files": [
|
|
@@ -1498,7 +1498,9 @@ const DataGrid = forwardRef(
|
|
|
1498
1498
|
CustomFetch(
|
|
1499
1499
|
s.url + '/' + d[form.primaryKey],
|
|
1500
1500
|
s.method,
|
|
1501
|
-
{
|
|
1501
|
+
{
|
|
1502
|
+
...s.data,
|
|
1503
|
+
},
|
|
1502
1504
|
function (result) {
|
|
1503
1505
|
if (result.error === '') {
|
|
1504
1506
|
handleReload();
|
|
@@ -2299,9 +2301,149 @@ const DataGrid = forwardRef(
|
|
|
2299
2301
|
let allow = true;
|
|
2300
2302
|
|
|
2301
2303
|
if (s.active) {
|
|
2304
|
+
// Helper function to get nested values for main active condition (searches for target value)
|
|
2305
|
+
const getNestedValueForMain = (data, path, targetValue) => {
|
|
2306
|
+
if (Array.isArray(path)) {
|
|
2307
|
+
return path.reduce(
|
|
2308
|
+
(currentValue, key) =>
|
|
2309
|
+
currentValue && currentValue[key] !== undefined
|
|
2310
|
+
? currentValue[key]
|
|
2311
|
+
: undefined,
|
|
2312
|
+
data
|
|
2313
|
+
);
|
|
2314
|
+
} else if (typeof path === 'string' && path.includes('.')) {
|
|
2315
|
+
const keys = path.split('.');
|
|
2316
|
+
let currentValue = data;
|
|
2317
|
+
|
|
2318
|
+
for (let i = 0; i < keys.length; i++) {
|
|
2319
|
+
const key = keys[i];
|
|
2320
|
+
|
|
2321
|
+
if (!currentValue) return undefined;
|
|
2322
|
+
|
|
2323
|
+
// Handle array search pattern like "customers[].pivot.is_primary"
|
|
2324
|
+
if (key.includes('[]')) {
|
|
2325
|
+
const arrayKey = key.replace('[]', '');
|
|
2326
|
+
const remainingPath = keys
|
|
2327
|
+
.slice(i + 1)
|
|
2328
|
+
.join('.');
|
|
2329
|
+
|
|
2330
|
+
if (Array.isArray(currentValue[arrayKey])) {
|
|
2331
|
+
// Search through the array for the target value
|
|
2332
|
+
for (const item of currentValue[arrayKey]) {
|
|
2333
|
+
const result = remainingPath
|
|
2334
|
+
? getNestedValueForMain(
|
|
2335
|
+
item,
|
|
2336
|
+
remainingPath,
|
|
2337
|
+
targetValue
|
|
2338
|
+
)
|
|
2339
|
+
: item;
|
|
2340
|
+
if (result === targetValue) {
|
|
2341
|
+
return result;
|
|
2342
|
+
}
|
|
2343
|
+
}
|
|
2344
|
+
}
|
|
2345
|
+
return undefined;
|
|
2346
|
+
} else {
|
|
2347
|
+
currentValue = currentValue[key];
|
|
2348
|
+
}
|
|
2349
|
+
}
|
|
2350
|
+
|
|
2351
|
+
return currentValue;
|
|
2352
|
+
} else {
|
|
2353
|
+
// Fallback to simple property access
|
|
2354
|
+
return data[path];
|
|
2355
|
+
}
|
|
2356
|
+
};
|
|
2357
|
+
|
|
2358
|
+
// Helper function to get nested values for additional conditions (returns first valid value)
|
|
2359
|
+
const getNestedValueForAdditional = (data, path) => {
|
|
2360
|
+
if (Array.isArray(path)) {
|
|
2361
|
+
return path.reduce(
|
|
2362
|
+
(currentValue, key) =>
|
|
2363
|
+
currentValue && currentValue[key] !== undefined
|
|
2364
|
+
? currentValue[key]
|
|
2365
|
+
: undefined,
|
|
2366
|
+
data
|
|
2367
|
+
);
|
|
2368
|
+
} else if (typeof path === 'string' && path.includes('.')) {
|
|
2369
|
+
const keys = path.split('.');
|
|
2370
|
+
let currentValue = data;
|
|
2371
|
+
|
|
2372
|
+
for (let i = 0; i < keys.length; i++) {
|
|
2373
|
+
const key = keys[i];
|
|
2374
|
+
|
|
2375
|
+
if (!currentValue) return undefined;
|
|
2376
|
+
|
|
2377
|
+
// Handle array search pattern like "customers[].id"
|
|
2378
|
+
if (key.includes('[]')) {
|
|
2379
|
+
const arrayKey = key.replace('[]', '');
|
|
2380
|
+
const remainingPath = keys
|
|
2381
|
+
.slice(i + 1)
|
|
2382
|
+
.join('.');
|
|
2383
|
+
|
|
2384
|
+
if (Array.isArray(currentValue[arrayKey])) {
|
|
2385
|
+
// Return the first valid result from the array
|
|
2386
|
+
for (const item of currentValue[arrayKey]) {
|
|
2387
|
+
const result = remainingPath
|
|
2388
|
+
? getNestedValueForAdditional(
|
|
2389
|
+
item,
|
|
2390
|
+
remainingPath
|
|
2391
|
+
)
|
|
2392
|
+
: item;
|
|
2393
|
+
if (result !== undefined) {
|
|
2394
|
+
return result;
|
|
2395
|
+
}
|
|
2396
|
+
}
|
|
2397
|
+
}
|
|
2398
|
+
return undefined;
|
|
2399
|
+
} else {
|
|
2400
|
+
currentValue = currentValue[key];
|
|
2401
|
+
}
|
|
2402
|
+
}
|
|
2403
|
+
|
|
2404
|
+
return currentValue;
|
|
2405
|
+
} else {
|
|
2406
|
+
// Fallback to simple property access
|
|
2407
|
+
return data[path];
|
|
2408
|
+
}
|
|
2409
|
+
};
|
|
2410
|
+
|
|
2411
|
+
// Get the active value using nested path or simple property access
|
|
2412
|
+
const activeValue = getNestedValueForMain(
|
|
2413
|
+
d,
|
|
2414
|
+
s.active.id,
|
|
2415
|
+
s.active.value
|
|
2416
|
+
);
|
|
2417
|
+
const hasActiveProperty = activeValue !== undefined;
|
|
2418
|
+
|
|
2419
|
+
// Check additional conditions if they exist
|
|
2420
|
+
const checkAdditionalConditions = () => {
|
|
2421
|
+
if (
|
|
2422
|
+
!s.active.additional ||
|
|
2423
|
+
!Array.isArray(s.active.additional)
|
|
2424
|
+
) {
|
|
2425
|
+
return true; // No additional conditions, so they pass
|
|
2426
|
+
}
|
|
2427
|
+
|
|
2428
|
+
// All additional conditions must be met
|
|
2429
|
+
return s.active.additional.every((condition) => {
|
|
2430
|
+
const conditionValue = getNestedValueForAdditional(
|
|
2431
|
+
d,
|
|
2432
|
+
condition.id
|
|
2433
|
+
);
|
|
2434
|
+
// Type-flexible comparison - convert both to strings for comparison
|
|
2435
|
+
return (
|
|
2436
|
+
String(conditionValue) === String(condition.value)
|
|
2437
|
+
);
|
|
2438
|
+
});
|
|
2439
|
+
};
|
|
2440
|
+
|
|
2441
|
+
const additionalConditionsMet = checkAdditionalConditions();
|
|
2442
|
+
|
|
2302
2443
|
if (
|
|
2303
|
-
|
|
2304
|
-
|
|
2444
|
+
hasActiveProperty &&
|
|
2445
|
+
String(activeValue) === String(s.active.value) &&
|
|
2446
|
+
additionalConditionsMet &&
|
|
2305
2447
|
s.active.type !== 'greater' &&
|
|
2306
2448
|
s.active.type !== 'not null'
|
|
2307
2449
|
) {
|
|
@@ -2310,14 +2452,16 @@ const DataGrid = forwardRef(
|
|
|
2310
2452
|
};
|
|
2311
2453
|
} else if (
|
|
2312
2454
|
s.active.type === 'greater' &&
|
|
2313
|
-
|
|
2455
|
+
Number(activeValue) > Number(s.active.value) &&
|
|
2456
|
+
additionalConditionsMet
|
|
2314
2457
|
) {
|
|
2315
2458
|
iconStyle = {
|
|
2316
2459
|
color: s.active.colour,
|
|
2317
2460
|
};
|
|
2318
2461
|
} else if (
|
|
2319
2462
|
s.active.type === 'not null' &&
|
|
2320
|
-
|
|
2463
|
+
activeValue !== null &&
|
|
2464
|
+
additionalConditionsMet
|
|
2321
2465
|
) {
|
|
2322
2466
|
iconStyle = {
|
|
2323
2467
|
color: s.active.colour,
|
|
@@ -5107,7 +5251,6 @@ const DataGrid = forwardRef(
|
|
|
5107
5251
|
style={{
|
|
5108
5252
|
...gridStyle,
|
|
5109
5253
|
border: '1px solid #d1d5db',
|
|
5110
|
-
borderRadius: 'var(--br, 4px)',
|
|
5111
5254
|
overflow: 'hidden',
|
|
5112
5255
|
}}
|
|
5113
5256
|
className={
|
|
@@ -259,11 +259,13 @@ function Field({
|
|
|
259
259
|
if (Array.isArray(s.child)) {
|
|
260
260
|
s.child.forEach((a) => {
|
|
261
261
|
if (a) {
|
|
262
|
+
console.info(a);
|
|
262
263
|
filter = {
|
|
263
264
|
where: [
|
|
264
265
|
{
|
|
265
266
|
id: s.id,
|
|
266
267
|
value: _inputValue,
|
|
268
|
+
...(a.whereHas && { whereHas: a.whereHas }),
|
|
267
269
|
},
|
|
268
270
|
],
|
|
269
271
|
};
|
|
@@ -2127,6 +2127,41 @@ function GenericDetail({
|
|
|
2127
2127
|
config.columns &&
|
|
2128
2128
|
config.settings
|
|
2129
2129
|
) {
|
|
2130
|
+
const processUrlParams = (obj) => {
|
|
2131
|
+
if (Array.isArray(obj)) {
|
|
2132
|
+
return obj.map(processUrlParams);
|
|
2133
|
+
} else if (obj && typeof obj === 'object') {
|
|
2134
|
+
const processed = {};
|
|
2135
|
+
for (const [
|
|
2136
|
+
key,
|
|
2137
|
+
value,
|
|
2138
|
+
] of Object.entries(obj)) {
|
|
2139
|
+
if (value === 'urlParam') {
|
|
2140
|
+
processed[key] =
|
|
2141
|
+
routeParams[urlParam];
|
|
2142
|
+
} else if (
|
|
2143
|
+
typeof value === 'object' && value !== null
|
|
2144
|
+
) {
|
|
2145
|
+
processed[key] =
|
|
2146
|
+
processUrlParams(value);
|
|
2147
|
+
} else {
|
|
2148
|
+
processed[key] = value;
|
|
2149
|
+
}
|
|
2150
|
+
}
|
|
2151
|
+
return processed;
|
|
2152
|
+
}
|
|
2153
|
+
return obj;
|
|
2154
|
+
};
|
|
2155
|
+
|
|
2156
|
+
const processedSettings = config.settings
|
|
2157
|
+
? processUrlParams(config.settings)
|
|
2158
|
+
: config.settings;
|
|
2159
|
+
|
|
2160
|
+
const processedConfig = {
|
|
2161
|
+
...config,
|
|
2162
|
+
settings: processedSettings,
|
|
2163
|
+
};
|
|
2164
|
+
|
|
2130
2165
|
return (
|
|
2131
2166
|
<>
|
|
2132
2167
|
{activeTabConfig.dropzone &&
|
|
@@ -2292,7 +2327,7 @@ function GenericDetail({
|
|
|
2292
2327
|
<div className={styles.grid__row}>
|
|
2293
2328
|
<div className={styles.grid__full}>
|
|
2294
2329
|
<Table
|
|
2295
|
-
{...
|
|
2330
|
+
{...processedConfig}
|
|
2296
2331
|
ref={gridRef}
|
|
2297
2332
|
gridHeight={
|
|
2298
2333
|
windowHeight * 0.65
|
|
@@ -57,7 +57,6 @@
|
|
|
57
57
|
|
|
58
58
|
.InovuaReactDataGrid {
|
|
59
59
|
color: var(--paragraph-color) !important;
|
|
60
|
-
border-radius: var(--br, 4px) !important;
|
|
61
60
|
overflow: hidden !important;
|
|
62
61
|
}
|
|
63
62
|
|
|
@@ -494,11 +493,8 @@
|
|
|
494
493
|
|
|
495
494
|
/* DataGrid top container and search container styles */
|
|
496
495
|
.dataGridTopContainer {
|
|
497
|
-
display: flex;
|
|
498
496
|
justify-content: space-between;
|
|
499
497
|
align-items: center;
|
|
500
|
-
margin-bottom: 8px;
|
|
501
|
-
padding: 0 5px;
|
|
502
498
|
}
|
|
503
499
|
|
|
504
500
|
.dataGridTopLeftContainer {
|
|
@@ -543,8 +539,9 @@
|
|
|
543
539
|
align-items: center;
|
|
544
540
|
justify-content: space-between;
|
|
545
541
|
width: 100%;
|
|
546
|
-
border: 1px solid #d1d5db;
|
|
547
|
-
border-
|
|
542
|
+
border-top: 1px solid #d1d5db;
|
|
543
|
+
border-left: 1px solid #d1d5db;
|
|
544
|
+
border-right: 1px solid #d1d5db;
|
|
548
545
|
overflow: hidden;
|
|
549
546
|
background-color: #fff;
|
|
550
547
|
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
|
|
@@ -733,7 +730,6 @@
|
|
|
733
730
|
/* DataGrid container styles */
|
|
734
731
|
.dataGridContainer {
|
|
735
732
|
width: 100%;
|
|
736
|
-
border-radius: var(--br, 4px);
|
|
737
733
|
overflow: hidden;
|
|
738
734
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
|
|
739
735
|
|