@archbase/components 4.0.31 → 4.0.32
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/dist/archbase-components-4.0.32.tgz +0 -0
- package/dist/datagrid/ag-grid/archbase-data-grid-ag-enum-filter.d.ts +16 -0
- package/dist/index.js +5905 -5864
- package/package.json +4 -4
- package/src/datagrid/ag-grid/archbase-data-grid-ag-enum-filter.tsx +79 -0
- package/src/datagrid/ag-grid/archbase-data-grid-ag-utils.ts +22 -11
- package/src/datagrid/ag-grid/archbase-data-grid-ag.tsx +9 -1
- package/dist/archbase-components-4.0.31.tgz +0 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@archbase/components",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.32",
|
|
4
4
|
"description": "UI Components for Archbase React v3 - Form editors, data visualization, and business components",
|
|
5
5
|
"author": "Edson Martins <edsonmartins2005@gmail.com>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -118,9 +118,9 @@
|
|
|
118
118
|
"vis-timeline": "^7.7.3",
|
|
119
119
|
"xlsx": "^0.18.5",
|
|
120
120
|
"yet-another-react-lightbox": "^3.21.0",
|
|
121
|
-
"@archbase/core": "4.0.
|
|
122
|
-
"@archbase/data": "4.0.
|
|
123
|
-
"@archbase/layout": "4.0.
|
|
121
|
+
"@archbase/core": "4.0.32",
|
|
122
|
+
"@archbase/data": "4.0.32",
|
|
123
|
+
"@archbase/layout": "4.0.32"
|
|
124
124
|
},
|
|
125
125
|
"devDependencies": {
|
|
126
126
|
"@types/d3": "^7.4.3",
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { useCallback, useRef, useState } from 'react';
|
|
2
|
+
import { useGridFilter } from 'ag-grid-react';
|
|
3
|
+
import type { CustomFilterProps } from 'ag-grid-react';
|
|
4
|
+
import { Checkbox, Divider, Stack } from '@mantine/core';
|
|
5
|
+
|
|
6
|
+
interface EnumFilterModel {
|
|
7
|
+
filterType: 'set';
|
|
8
|
+
values: string[];
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
type Props = CustomFilterProps<any, any, EnumFilterModel> & {
|
|
12
|
+
enumValues?: Array<{ label: string; value: string }>;
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
export function ArchbaseEnumSetFilter({ model, onModelChange, onUiChange, colDef, enumValues = [] }: Props) {
|
|
16
|
+
const [pending, setPending] = useState<string[]>(model?.values ?? []);
|
|
17
|
+
|
|
18
|
+
// modelRef keeps doesFilterPass and afterGuiAttached stable across re-renders.
|
|
19
|
+
// FilterComponentWrapper.setMethods() calls filterChangedCallback() whenever
|
|
20
|
+
// doesFilterPass changes reference — causing an infinite loop if defined inline.
|
|
21
|
+
const modelRef = useRef(model);
|
|
22
|
+
modelRef.current = model;
|
|
23
|
+
|
|
24
|
+
const field = ((colDef as any).field ?? '') as string;
|
|
25
|
+
|
|
26
|
+
const doesFilterPass = useCallback(({ data }: any) => {
|
|
27
|
+
if (!modelRef.current?.values?.length) return true;
|
|
28
|
+
return modelRef.current.values.includes(data?.[field]);
|
|
29
|
+
}, [field]);
|
|
30
|
+
|
|
31
|
+
const afterGuiAttached = useCallback(() => {
|
|
32
|
+
setPending(modelRef.current?.values ?? []);
|
|
33
|
+
}, []);
|
|
34
|
+
|
|
35
|
+
useGridFilter({ doesFilterPass, afterGuiAttached });
|
|
36
|
+
|
|
37
|
+
const toggle = (value: string) => {
|
|
38
|
+
setPending((prev) =>
|
|
39
|
+
prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]
|
|
40
|
+
);
|
|
41
|
+
onUiChange();
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
const handleApply = () => {
|
|
45
|
+
onModelChange(pending.length === 0 ? null : { filterType: 'set', values: pending });
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
const handleReset = () => {
|
|
49
|
+
setPending([]);
|
|
50
|
+
onModelChange(null);
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
return (
|
|
54
|
+
<Stack gap={0} miw={180}>
|
|
55
|
+
<Stack p="xs" gap={6}>
|
|
56
|
+
{enumValues.map((opt) => (
|
|
57
|
+
<Checkbox
|
|
58
|
+
key={opt.value}
|
|
59
|
+
label={opt.label}
|
|
60
|
+
size="sm"
|
|
61
|
+
checked={pending.includes(opt.value)}
|
|
62
|
+
onChange={() => toggle(opt.value)}
|
|
63
|
+
/>
|
|
64
|
+
))}
|
|
65
|
+
</Stack>
|
|
66
|
+
<Divider />
|
|
67
|
+
<div className="ag-filter-apply-panel">
|
|
68
|
+
<button className="ag-standard-button ag-filter-apply-panel-button" onClick={handleReset}>
|
|
69
|
+
Redefinir
|
|
70
|
+
</button>
|
|
71
|
+
<button className="ag-standard-button ag-filter-apply-panel-button" onClick={handleApply}>
|
|
72
|
+
Aplicar
|
|
73
|
+
</button>
|
|
74
|
+
</div>
|
|
75
|
+
</Stack>
|
|
76
|
+
);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
ArchbaseEnumSetFilter.displayName = 'ArchbaseEnumSetFilter';
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
* Helper functions for AG Grid implementation.
|
|
5
5
|
*/
|
|
6
6
|
import type { ColDef, SortModelItem } from 'ag-grid-community';
|
|
7
|
+
import { builder, emit } from '@archbase/core';
|
|
7
8
|
import type { IArchbaseDataSourceBase } from '@archbase/data';
|
|
8
9
|
import type {
|
|
9
10
|
ArchbaseFilterDefinition,
|
|
@@ -143,19 +144,22 @@ export const buildFilterExpression = (
|
|
|
143
144
|
let filterExpr = '';
|
|
144
145
|
switch (type) {
|
|
145
146
|
case 'contains':
|
|
146
|
-
filterExpr = `${field}
|
|
147
|
+
filterExpr = `${field}==^*${value}*`;
|
|
148
|
+
break;
|
|
149
|
+
case 'notContains':
|
|
150
|
+
filterExpr = `${field}!=^*${value}*`;
|
|
147
151
|
break;
|
|
148
152
|
case 'equals':
|
|
149
|
-
filterExpr =
|
|
153
|
+
filterExpr = emit(builder.eq(field, value));
|
|
150
154
|
break;
|
|
151
155
|
case 'notEqual':
|
|
152
|
-
filterExpr =
|
|
156
|
+
filterExpr = emit(builder.neq(field, value));
|
|
153
157
|
break;
|
|
154
158
|
case 'startsWith':
|
|
155
|
-
filterExpr = `${field}
|
|
159
|
+
filterExpr = `${field}==^${value}*`;
|
|
156
160
|
break;
|
|
157
161
|
case 'endsWith':
|
|
158
|
-
filterExpr = `${field}
|
|
162
|
+
filterExpr = `${field}==^*${value}`;
|
|
159
163
|
break;
|
|
160
164
|
case 'blank':
|
|
161
165
|
filterExpr = `${field}==null`;
|
|
@@ -164,26 +168,33 @@ export const buildFilterExpression = (
|
|
|
164
168
|
filterExpr = `${field}!=null`;
|
|
165
169
|
break;
|
|
166
170
|
case 'greaterThan':
|
|
167
|
-
filterExpr =
|
|
171
|
+
filterExpr = emit(builder.gt(field, value));
|
|
168
172
|
break;
|
|
169
173
|
case 'greaterThanOrEqual':
|
|
170
|
-
filterExpr =
|
|
174
|
+
filterExpr = emit(builder.ge(field, value));
|
|
171
175
|
break;
|
|
172
176
|
case 'lessThan':
|
|
173
|
-
filterExpr =
|
|
177
|
+
filterExpr = emit(builder.lt(field, value));
|
|
174
178
|
break;
|
|
175
179
|
case 'lessThanOrEqual':
|
|
176
|
-
filterExpr =
|
|
180
|
+
filterExpr = emit(builder.le(field, value));
|
|
177
181
|
break;
|
|
178
182
|
case 'inRange':
|
|
179
|
-
filterExpr =
|
|
183
|
+
filterExpr = emit(builder.bt(field, value, filterTo));
|
|
180
184
|
break;
|
|
181
185
|
default:
|
|
182
186
|
if (value) {
|
|
183
|
-
filterExpr =
|
|
187
|
+
filterExpr = emit(builder.eq(field, value));
|
|
184
188
|
}
|
|
185
189
|
}
|
|
186
190
|
|
|
191
|
+
// Handle set filter (enum) — values array from ArchbaseEnumSetFilter
|
|
192
|
+
if (!filterExpr && values && Array.isArray(values) && values.length > 0) {
|
|
193
|
+
filterExpr = values.length === 1
|
|
194
|
+
? emit(builder.eq(field, String(values[0])))
|
|
195
|
+
: emit(builder.in(field, values.map(String)));
|
|
196
|
+
}
|
|
197
|
+
|
|
187
198
|
if (filterExpr) {
|
|
188
199
|
filterParts.push(filterExpr);
|
|
189
200
|
}
|
|
@@ -141,6 +141,7 @@ import {
|
|
|
141
141
|
getAlignmentByDataType,
|
|
142
142
|
createValueFormatter,
|
|
143
143
|
} from './archbase-data-grid-ag-formatters';
|
|
144
|
+
import { ArchbaseEnumSetFilter } from './archbase-data-grid-ag-enum-filter';
|
|
144
145
|
|
|
145
146
|
// Import shared components
|
|
146
147
|
import { ArchbaseDataGridToolbar } from '../main/archbase-data-grid-toolbar';
|
|
@@ -497,6 +498,7 @@ function ArchbaseDataGridAG<T extends object = any, ID = any>(
|
|
|
497
498
|
}
|
|
498
499
|
: undefined;
|
|
499
500
|
|
|
501
|
+
const isEnumColumn = dataType === 'enum' && (columnProps.enumValues?.length ?? 0) > 0;
|
|
500
502
|
const colDef: ExtendedColDef<T> = {
|
|
501
503
|
field: columnProps.dataField as any,
|
|
502
504
|
headerName: columnProps.header,
|
|
@@ -504,7 +506,12 @@ function ArchbaseDataGridAG<T extends object = any, ID = any>(
|
|
|
504
506
|
minWidth: columnProps.minSize,
|
|
505
507
|
maxWidth: columnProps.maxSize,
|
|
506
508
|
sortable: columnProps.enableSorting !== false,
|
|
507
|
-
filter: columnProps.enableColumnFilter !== false && allowColumnFilters
|
|
509
|
+
filter: columnProps.enableColumnFilter !== false && allowColumnFilters
|
|
510
|
+
? (isEnumColumn ? ArchbaseEnumSetFilter : true)
|
|
511
|
+
: false,
|
|
512
|
+
filterParams: isEnumColumn
|
|
513
|
+
? { enumValues: columnProps.enumValues, closeOnApply: true }
|
|
514
|
+
: undefined,
|
|
508
515
|
resizable: enableColumnResizing,
|
|
509
516
|
flex: columnAutoWidth ? 1 : undefined,
|
|
510
517
|
cellRenderer,
|
|
@@ -581,6 +588,7 @@ function ArchbaseDataGridAG<T extends object = any, ID = any>(
|
|
|
581
588
|
filterParams: {
|
|
582
589
|
buttons: ['reset', 'apply'],
|
|
583
590
|
closeOnApply: true,
|
|
591
|
+
maxNumConditions: 1,
|
|
584
592
|
},
|
|
585
593
|
}),
|
|
586
594
|
[enableColumnResizing, allowColumnFilters]
|
|
Binary file
|