@memberjunction/ng-filter-builder 4.0.0 → 4.1.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.
Files changed (2) hide show
  1. package/README.md +125 -0
  2. package/package.json +2 -2
package/README.md ADDED
@@ -0,0 +1,125 @@
1
+ # @memberjunction/ng-filter-builder
2
+
3
+ A modern, intuitive Angular filter builder component for creating complex boolean filter expressions. Outputs portable, Kendo-compatible `CompositeFilterDescriptor` JSON for seamless integration with MemberJunction views and grids.
4
+
5
+ ## Installation
6
+
7
+ ```bash
8
+ npm install @memberjunction/ng-filter-builder
9
+ ```
10
+
11
+ ## Overview
12
+
13
+ The Filter Builder provides a visual interface for constructing nested AND/OR filter expressions against entity fields. It supports multiple field types (string, number, boolean, date, lookup), nested groups up to a configurable depth, and generates a human-readable summary of the active filter.
14
+
15
+ ```mermaid
16
+ graph TD
17
+ A["FilterBuilderComponent"] --> B["FilterGroupComponent"]
18
+ B --> C["FilterRuleComponent"]
19
+ B --> D["FilterRuleComponent"]
20
+ B --> E["Nested FilterGroupComponent"]
21
+ E --> F["FilterRuleComponent"]
22
+ A --> G["CompositeFilterDescriptor JSON"]
23
+
24
+ style A fill:#2d6a9f,stroke:#1a4971,color:#fff
25
+ style B fill:#7c5295,stroke:#563a6b,color:#fff
26
+ style C fill:#2d8659,stroke:#1a5c3a,color:#fff
27
+ style D fill:#2d8659,stroke:#1a5c3a,color:#fff
28
+ style E fill:#7c5295,stroke:#563a6b,color:#fff
29
+ style F fill:#2d8659,stroke:#1a5c3a,color:#fff
30
+ style G fill:#b8762f,stroke:#8a5722,color:#fff
31
+ ```
32
+
33
+ ## Usage
34
+
35
+ ### Module Import
36
+
37
+ ```typescript
38
+ import { FilterBuilderModule } from '@memberjunction/ng-filter-builder';
39
+
40
+ @NgModule({
41
+ imports: [FilterBuilderModule]
42
+ })
43
+ export class YourModule {}
44
+ ```
45
+
46
+ ### Basic Usage
47
+
48
+ ```html
49
+ <mj-filter-builder
50
+ [fields]="filterFields"
51
+ [filter]="currentFilter"
52
+ (filterChange)="onFilterChange($event)">
53
+ </mj-filter-builder>
54
+ ```
55
+
56
+ ### Defining Fields
57
+
58
+ ```typescript
59
+ import { FilterFieldInfo } from '@memberjunction/ng-filter-builder';
60
+
61
+ filterFields: FilterFieldInfo[] = [
62
+ { name: 'Name', displayName: 'Name', type: 'string' },
63
+ { name: 'Age', displayName: 'Age', type: 'number' },
64
+ { name: 'IsActive', displayName: 'Active', type: 'boolean' },
65
+ { name: 'CreatedAt', displayName: 'Created Date', type: 'date' },
66
+ { name: 'CategoryID', displayName: 'Category', type: 'lookup', lookupEntityName: 'Categories' }
67
+ ];
68
+ ```
69
+
70
+ ### Configuration Options
71
+
72
+ ```html
73
+ <mj-filter-builder
74
+ [fields]="filterFields"
75
+ [config]="{
76
+ maxDepth: 3,
77
+ allowGroups: true,
78
+ showClearButton: true,
79
+ showApplyButton: false,
80
+ applyOnChange: true
81
+ }"
82
+ [showSummary]="true"
83
+ [disabled]="false"
84
+ (filterChange)="onFilterChange($event)"
85
+ (apply)="onApply($event)"
86
+ (clear)="onClear()">
87
+ </mj-filter-builder>
88
+ ```
89
+
90
+ ## Components
91
+
92
+ | Component | Selector | Purpose |
93
+ |-----------|----------|---------|
94
+ | `FilterBuilderComponent` | `mj-filter-builder` | Top-level container with config, summary, and clear/apply buttons |
95
+ | `FilterGroupComponent` | internal | Renders a group of rules combined by AND/OR logic |
96
+ | `FilterRuleComponent` | internal | Renders a single filter rule (field, operator, value) |
97
+
98
+ ## Supported Operators by Field Type
99
+
100
+ | Type | Operators |
101
+ |------|-----------|
102
+ | String | contains, does not contain, equals, not equals, starts with, ends with, is empty, is not empty |
103
+ | Number | equals, not equals, greater than, greater/equal, less than, less/equal, is empty, is not empty |
104
+ | Boolean | is, is not, is empty, is not empty |
105
+ | Date | equals, not equals, is after, is on or after, is before, is on or before, is empty, is not empty |
106
+ | Lookup | equals, not equals, contains, does not contain, starts with, ends with, is empty, is not empty |
107
+
108
+ ## Exported Types
109
+
110
+ - `FilterOperator` -- Union type of all operator strings
111
+ - `FilterLogic` -- `'and' | 'or'`
112
+ - `FilterDescriptor` -- Single filter condition
113
+ - `CompositeFilterDescriptor` -- Group of filters with AND/OR logic
114
+ - `FilterFieldInfo` -- Field metadata for the builder
115
+ - `FilterBuilderConfig` -- Configuration options
116
+ - `FilterValueOption` -- Value option for dropdown fields
117
+
118
+ ## Utility Functions
119
+
120
+ - `createEmptyFilter()` -- Creates a new empty `CompositeFilterDescriptor`
121
+ - `createFilterRule(field, type)` -- Creates a new filter rule with defaults
122
+ - `isCompositeFilter(filter)` -- Type guard for composite filters
123
+ - `isSimpleFilter(filter)` -- Type guard for simple filter descriptors
124
+ - `getOperatorsForType(type)` -- Returns available operators for a field type
125
+ - `operatorRequiresValue(operator)` -- Checks if an operator needs a value input
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@memberjunction/ng-filter-builder",
3
- "version": "4.0.0",
3
+ "version": "4.1.0",
4
4
  "description": "MemberJunction: Angular Filter Builder Component - a modern, intuitive filter builder for creating complex boolean filter expressions with portable JSON format.",
5
5
  "main": "./dist/public-api.js",
6
6
  "typings": "./dist/public-api.d.ts",
@@ -31,7 +31,7 @@
31
31
  },
32
32
  "dependencies": {
33
33
  "@angular/platform-browser": "21.1.3",
34
- "@memberjunction/core": "4.0.0",
34
+ "@memberjunction/core": "4.1.0",
35
35
  "tslib": "^2.8.1"
36
36
  },
37
37
  "sideEffects": false,