@ngstarter-ui/components 1.0.22 → 1.0.23
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/fesm2022/ngstarter-ui-components-comment-editor.mjs +30 -5
- package/fesm2022/ngstarter-ui-components-comment-editor.mjs.map +1 -1
- package/fesm2022/ngstarter-ui-components-core.mjs +1 -1
- package/fesm2022/ngstarter-ui-components-core.mjs.map +1 -1
- package/fesm2022/ngstarter-ui-components-filter-builder.mjs +18 -5
- package/fesm2022/ngstarter-ui-components-filter-builder.mjs.map +1 -1
- package/package.json +1 -1
- package/types/ngstarter-ui-components-comment-editor.d.ts +2 -0
- package/types/ngstarter-ui-components-filter-builder.d.ts +1 -0
|
@@ -85,6 +85,7 @@ class FilterBuilder {
|
|
|
85
85
|
_value = [];
|
|
86
86
|
_operations = [];
|
|
87
87
|
editItem;
|
|
88
|
+
_tempMultipleValue = [];
|
|
88
89
|
ngOnInit() {
|
|
89
90
|
if (this.value().length) {
|
|
90
91
|
if (!this._isGroup(this.value()[0])) {
|
|
@@ -136,14 +137,14 @@ class FilterBuilder {
|
|
|
136
137
|
return this.groupOperations().find(groupOperator => groupOperator.id === groupLogicalOperatorId)?.name || '';
|
|
137
138
|
}
|
|
138
139
|
selectConditionField(item, field) {
|
|
139
|
-
this.editItem = undefined;
|
|
140
140
|
let allowedTypes = this._operationAllowedTypesMap.get(field.dataType);
|
|
141
|
+
item['value'][0] = field.dataField;
|
|
141
142
|
item['value'][1] = allowedTypes[0];
|
|
142
143
|
this._resetValue(field, item);
|
|
144
|
+
this.editItem = undefined;
|
|
143
145
|
this._emitChangeEvent();
|
|
144
146
|
}
|
|
145
147
|
operationChanged(item, operation) {
|
|
146
|
-
this.editItem = undefined;
|
|
147
148
|
const oldOperation = item['value'][1];
|
|
148
149
|
if (oldOperation === 'equals' && operation === 'isAnyOf') {
|
|
149
150
|
item['value'][2] = [];
|
|
@@ -161,6 +162,7 @@ class FilterBuilder {
|
|
|
161
162
|
item['value'][2] = null;
|
|
162
163
|
}
|
|
163
164
|
item['value'][1] = operation;
|
|
165
|
+
this.editItem = undefined;
|
|
164
166
|
this._emitChangeEvent();
|
|
165
167
|
}
|
|
166
168
|
removeCondition(index, items) {
|
|
@@ -177,6 +179,9 @@ class FilterBuilder {
|
|
|
177
179
|
}
|
|
178
180
|
modifyValue(item) {
|
|
179
181
|
this.editItem = item;
|
|
182
|
+
if (this.getFieldType(item) === 'array' && item['value'][1] === 'isAnyOf') {
|
|
183
|
+
this._tempMultipleValue = [...(item['value'][2] || [])];
|
|
184
|
+
}
|
|
180
185
|
}
|
|
181
186
|
getFieldType(item) {
|
|
182
187
|
return this.fieldDefs().find(f => f.dataField === item['value'][0]).dataType;
|
|
@@ -210,6 +215,9 @@ class FilterBuilder {
|
|
|
210
215
|
return (fieldDef.lookup?.dataSource).find(item => item.id === dataSourceItemId)?.name || '';
|
|
211
216
|
}
|
|
212
217
|
selectBlur(event) {
|
|
218
|
+
if (this.editItem && this.getFieldType(this.editItem) === 'array' && this.editItem['value'][1] === 'isAnyOf') {
|
|
219
|
+
return;
|
|
220
|
+
}
|
|
213
221
|
event.preventDefault();
|
|
214
222
|
event.stopPropagation();
|
|
215
223
|
const select = event.target;
|
|
@@ -221,8 +229,13 @@ class FilterBuilder {
|
|
|
221
229
|
}, 200);
|
|
222
230
|
}
|
|
223
231
|
selectClosed() {
|
|
232
|
+
if (this.editItem && this.getFieldType(this.editItem) === 'array' && this.editItem['value'][1] === 'isAnyOf') {
|
|
233
|
+
this.editItem['value'][2] = [...this._tempMultipleValue];
|
|
234
|
+
}
|
|
224
235
|
this.cancelEdit();
|
|
225
|
-
|
|
236
|
+
setTimeout(() => {
|
|
237
|
+
this._emitChangeEvent();
|
|
238
|
+
});
|
|
226
239
|
}
|
|
227
240
|
operationIconTemplateRef(operation) {
|
|
228
241
|
return operation.operationIcon()?.templateRef;
|
|
@@ -299,7 +312,7 @@ class FilterBuilder {
|
|
|
299
312
|
return result;
|
|
300
313
|
}
|
|
301
314
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: FilterBuilder, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
302
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: FilterBuilder, isStandalone: true, selector: "ngs-filter-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, fieldDefs: { classPropertyName: "fieldDefs", publicName: "fieldDefs", isSignal: true, isRequired: false, transformFunction: null }, categories: { classPropertyName: "categories", publicName: "categories", isSignal: true, isRequired: false, transformFunction: null }, groupOperations: { classPropertyName: "groupOperations", publicName: "groupOperations", isSignal: true, isRequired: false, transformFunction: null }, customOperations: { classPropertyName: "customOperations", publicName: "customOperations", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, host: { classAttribute: "ngs-filter-builder" }, queries: [{ propertyName: "_customOperationDefs", predicate: FilterBuilderOperationDefDirective, isSignal: true }], viewQueries: [{ propertyName: "_prebuiltOperationDefs", predicate: FilterBuilderOperationDefDirective, descendants: true, isSignal: true }], exportAs: ["ngsFilterBuilder"], ngImport: i0, template: "@if (_isServer) {\n <ng-content/>\n}\n\n<ng-template #itemsTpl let-items>\n <div class=\"group\">\n @for (item of items; track item; let index = $index) {\n @if (_isGroup(item)) {\n <div class=\"flex items-center group-operations\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button [ngsMenuTriggerFor]=\"nestedGroupOperationsMenu\" class=\"group-operation\">\n {{ getSelectedGroupOperationName(item) }}\n </button>\n <div [ngsMenuTriggerFor]=\"addGroupMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n <ngs-menu #nestedGroupOperationsMenu=\"ngsMenu\">\n <div ngsMenuOptionGroup [(ngModel)]=\"item['logicalOperator']\">\n @for (groupOperation of groupOperations(); track groupOperation.id) {\n <ngs-option [value]=\"groupOperation.id\">{{ groupOperation.name }}</ngs-option>\n }\n </div>\n </ngs-menu>\n <ngs-menu #addGroupMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"addCondition(item)\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup(item)\">Add Group</button>\n </ngs-menu>\n </div>\n @if (item['value'].length > 0) {\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: item['value'] }\" />\n }\n } @else if (_isCondition(item)) {\n <div class=\"condition\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button class=\"condition-field\"\n [ngsMenuTriggerFor]=\"fieldsMenu\">{{ getConditionField(item['value'][0])?.name }}</button>\n <button class=\"condition-operation\"\n [ngsMenuTriggerFor]=\"operationsMenu\">\n <ng-template [ngTemplateOutlet]=\"getConditionOperation(item['value'][1])?.name\" />\n </button>\n <div class=\"relative\">\n @if (editItem && editItem === item) {\n <div class=\"absolute start-0 top-0 -translate-y-1/2\">\n @switch (getFieldType(editItem)) {\n @case ('array') {\n @switch (editItem['value'][1]) {\n @case ('equals') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\"\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n\n @case ('isAnyOf') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\" multiple\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (closed)=\"selectClosed()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n }\n }\n\n @case ('number') {\n @switch (editItem['value'][1]) {\n @case ('isBetween') {\n <div class=\"flex gap-2 items-center\"\n ngsFocusElement (elementBlurred)=\"cancelEdit()\">\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n [(ngModel)]=\"item['value'][2][0]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n <div class=\"text-neutral-500\">–</div>\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput\n [(ngModel)]=\"item['value'][2][1]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n </div>\n }\n @default {\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n }\n\n @default {\n <ngs-form-field class=\"form-field\">\n <input type=\"text\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n </div>\n } @else {\n @if (item['value'][1] !== 'isBlank' && item['value'][1] !== 'isNotBlank') {\n @if (isValueNotEmpty(item)) {\n @if (getFieldType(item) === 'array') {\n @if (item['value'][1] === 'equals') {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n {{ getDataSourceItemNameById(item, item['value'][2]) }}\n </button>\n } @else {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n @for (dataSourceItemId of item['value'][2]; track dataSourceItemId; let last = $last) {\n <span>{{ getDataSourceItemNameById(item, dataSourceItemId) }}</span>\n @if (!last) {\n <span class=\"text-neutral-500\">|</span>\n }\n }\n </button>\n }\n } @else {\n @if (item['value'][1] === 'isBetween') {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2][0] }}</span>\n <span class=\"text-neutral-500\">–</span>\n <span>{{ item['value'][2][1] }}</span>\n </button>\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2] }}</span>\n </button>\n }\n }\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span i18n><enter a value></span>\n </button>\n }\n }\n }\n </div>\n </div>\n <ngs-menu #fieldsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"item['value'][0]\">\n @for (fieldDef of fieldDefs(); track fieldDef) {\n <ngs-option [value]=\"fieldDef.dataField\"\n (click)=\"selectConditionField(item, fieldDef)\">{{ fieldDef.name }}</ngs-option>\n }\n </div>\n </ng-template>\n </ngs-menu>\n <ngs-menu #operationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][1]\">\n @for (operation of _operationDefs; track operation.id()) {\n <div [hidden]=\"!isOperationAllowedForCondition(item['value'][0], operation.id())\">\n <ngs-option [value]=\"operation.id()\" (click)=\"operationChanged(item, operation.id())\">\n <div class=\"flex items-center gap-3\">\n @if (operation.operationIcon()) {\n <ng-template [ngTemplateOutlet]=\"operationIconTemplateRef(operation)\" />\n }\n <div>\n <ng-template [ngTemplateOutlet]=\"operationNameTemplateRef(operation)\" />\n </div>\n </div>\n </ngs-option>\n </div>\n }\n </div>\n </ng-template>\n </ngs-menu>\n }\n }\n </div>\n</ng-template>\n\n<div class=\"group\">\n <div class=\"flex items-center group-operations\">\n <button [ngsMenuTriggerFor]=\"groupOperationsMenu\" class=\"group-operation\">\n {{ getSelectedGroupOperationName() }}\n </button>\n <div [ngsMenuTriggerFor]=\"addMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n </div>\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: _value }\" />\n</div>\n\n<ngs-menu #groupOperationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"_logicalOperator\" (ngModelChange)=\"_emitChangeEvent()\">\n @for (operation of groupOperations(); track operation.id) {\n <ngs-option [value]=\"operation.id\">{{ operation.name }}</ngs-option>\n }\n </div>\n </ng-template>\n</ngs-menu>\n<ngs-menu #addMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <button ngs-menu-item (click)=\"addCondition()\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup()\">Add Group</button>\n </ng-template>\n</ngs-menu>\n\n<ng-container ngsFilterBuilderOperationDef=\"contains\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Contains</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"doesNotContain\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Does not contain</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"startsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Starts with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"endsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Ends with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"equals\" [allowedDataTypes]=\"['string', 'number', 'array', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"notEquals\" [allowedDataTypes]=\"['string', 'number', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Not equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isNotBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is not blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBetween\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is between</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isAnyOf\" [allowedDataTypes]=\"['array']\">\n <ng-template ngsFilterBuilderOperationName>Is any of</ng-template>\n</ng-container>\n", styles: [":host{--ngs-filter-builder-group-operations-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-font-size: var(--text-tiny);--ngs-filter-builder-group-operation-color: var(--color-on-surface);--ngs-filter-builder-group-operation-bg: var(--color-surface-container);--ngs-filter-builder-group-operation-font-weight: 400;--ngs-filter-builder-group-operation-border-radius: .5rem;--ngs-filter-builder-group-operation-bpadding: 0 calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-group-operation-hover-color: var(--color-on-surface);--ngs-filter-builder-group-operation-hover-bg: var(--color-surface-container-high);--ngs-filter-builder-group-operation-active-color: var(--color-on-surface);--ngs-filter-builder-group-operation-active-bg: var(--color-surface-container-highest);--ngs-filter-builder-group-operation-border: 1px solid var(--color-outline-variant);--ngs-filter-builder-group-add-color: var(--color-primary);--ngs-filter-builder-group-add-hover-color: var(--color-primary);--ngs-filter-builder-group-margin: 0;--ngs-filter-builder-group-padding: 0;--ngs-filter-builder-group-gap: calc(var(--spacing, .25rem) * 4);--ngs-filter-builder-condition-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-field-font-size: var(--text-tiny);--ngs-filter-builder-condition-field-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-bg: var(--color-primary-container);--ngs-filter-builder-condition-field-font-weight: 400;--ngs-filter-builder-condition-field-border-radius: .5rem;--ngs-filter-builder-condition-field-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-hover-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-hover-bg: var(--color-primary-400);--ngs-filter-builder-condition-field-active-color: var(--color-on-primary);--ngs-filter-builder-condition-field-active-bg: var(--color-primary);--ngs-filter-builder-condition-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-operation-font-size: var(--text-tiny);--ngs-filter-builder-condition-operation-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-bg: var(--color-secondary-container);--ngs-filter-builder-condition-operation-font-weight: 400;--ngs-filter-builder-condition-operation-border-radius: .5rem;--ngs-filter-builder-condition-operation-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-operation-hover-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-hover-bg: var(--color-secondary-400);--ngs-filter-builder-condition-operation-active-color: var(--color-on-secondary);--ngs-filter-builder-condition-operation-active-bg: var(--color-secondary);--ngs-filter-builder-condition-value-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-value-font-size: var(--text-tiny);--ngs-filter-builder-condition-value-color: var(--color-on-surface);--ngs-filter-builder-condition-value-bg: var(--color-surface-container-high);--ngs-filter-builder-condition-value-font-weight: 400;--ngs-filter-builder-condition-value-border-radius: .5rem;--ngs-filter-builder-condition-value-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-value-hover-color: var(--color-on-surface);--ngs-filter-builder-condition-value-hover-bg: var(--color-surface-container-highest);--ngs-filter-builder-condition-remove-color: var(--color-error);--ngs-filter-builder-condition-remove-hover-color: var(--color-error);display:block}:host ::ng-deep .ngs-form-field-infix{--ngs-form-field-container-height: 46px !important;--ngs-form-field-container-vertical-padding: 12px !important}:host ::ng-deep .subscript-wrapper{display:none}:host .form-field{width:200px}:host .form-field-number{width:140px}:host .group-operations{gap:var(--ngs-filter-builder-group-operations-gap)}:host .group{margin:var(--ngs-filter-builder-group-margin);padding:var(--ngs-filter-builder-group-padding);display:flex;flex-direction:column;gap:var(--ngs-filter-builder-group-gap)}:host .group .group{margin-left:calc(var(--spacing, .25rem) * 4)}:host .icon:empty{display:none}:host .group-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-group-operation-height);font-size:var(--ngs-filter-builder-group-operation-font-size);font-weight:var(--ngs-filter-builder-group-operation-font-weight);color:var(--ngs-filter-builder-group-operation-color);background:var(--ngs-filter-builder-group-operation-bg);border:var(--ngs-filter-builder-group-operation-border);border-radius:var(--ngs-filter-builder-group-operation-border-radius);padding:var(--ngs-filter-builder-group-operation-bpadding)}:host .group-operation:hover{color:var(--ngs-filter-builder-group-operation-hover-color);background:var(--ngs-filter-builder-group-operation-hover-bg)}:host .group-operation:active,:host .group-operation.active{color:var(--ngs-filter-builder-group-operation-active-color);background:var(--ngs-filter-builder-group-operation-active-bg)}:host .condition{display:flex;align-items:center;gap:var(--ngs-filter-builder-condition-gap)}:host .condition-field{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-field-height);font-size:var(--ngs-filter-builder-condition-field-font-size);font-weight:var(--ngs-filter-builder-condition-field-font-weight);color:var(--ngs-filter-builder-condition-field-color);background:var(--ngs-filter-builder-condition-field-bg);border-radius:var(--ngs-filter-builder-condition-field-border-radius);padding:var(--ngs-filter-builder-condition-field-bpadding)}:host .condition-field:hover{color:var(--ngs-filter-builder-condition-field-hover-color);background:var(--ngs-filter-builder-condition-field-hover-bg)}:host .add{line-height:0;color:var(--ngs-filter-builder-group-add-color);cursor:pointer}:host .add:hover{color:var(--ngs-filter-builder-group-add-hover-color)}:host .remove{line-height:0;color:var(--ngs-filter-builder-condition-remove-color);cursor:pointer}:host .remove:hover{color:var(--ngs-filter-builder-condition-remove-hover-color)}:host .condition-field:active,:host .condition-field.active{color:var(--ngs-filter-builder-condition-field-active-color);background:var(--ngs-filter-builder-condition-field-active-bg)}:host .condition-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-operation-height);font-size:var(--ngs-filter-builder-condition-operation-font-size);font-weight:var(--ngs-filter-builder-condition-operation-font-weight);color:var(--ngs-filter-builder-condition-operation-color);background:var(--ngs-filter-builder-condition-operation-bg);border-radius:var(--ngs-filter-builder-condition-operation-border-radius);padding:var(--ngs-filter-builder-condition-operation-bpadding)}:host .condition-operation:hover{color:var(--ngs-filter-builder-condition-operation-hover-color);background:var(--ngs-filter-builder-condition-operation-hover-bg)}:host .condition-operation:active,:host .condition-operation.active{color:var(--ngs-filter-builder-condition-operation-active-color);background:var(--ngs-filter-builder-condition-operation-active-bg)}:host .condition-value{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-value-height);font-size:var(--ngs-filter-builder-condition-value-font-size);font-weight:var(--ngs-filter-builder-condition-value-font-weight);color:var(--ngs-filter-builder-condition-value-color);background:var(--ngs-filter-builder-condition-value-bg);border-radius:var(--ngs-filter-builder-condition-value-border-radius);padding:var(--ngs-filter-builder-condition-value-bpadding)}:host .condition-value:hover{color:var(--ngs-filter-builder-condition-value-hover-color);background:var(--ngs-filter-builder-condition-value-hover-bg)}:host-context(html.dark){--ngs-filter-builder-group-operation-color: var(--color-neutral-200);--ngs-filter-builder-group-operation-hover-bg: var(--color-neutral-600);--ngs-filter-builder-group-operation-active-bg: var(--color-neutral-650);--ngs-filter-builder-group-operation-hover-color: var(--color-neutral-100);--ngs-filter-builder-group-operation-active-color: var(--color-neutral-50)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Icon, selector: "ngs-icon", inputs: ["name"], exportAs: ["ngsIcon"] }, { kind: "directive", type: MenuTrigger, selector: "[ngsMenuTriggerFor]", inputs: ["ngsMenuTriggerFor", "ngsMenuTriggerData", "ngsMenuDisabled", "xPosition", "yPosition", "ngsMenuTriggerRestoreFocus"], outputs: ["menuOpened", "menuClosed"], exportAs: ["ngsMenuTrigger"] }, { kind: "component", type: Menu, selector: "ngs-menu", inputs: ["role", "classList", "xPosition", "yPosition"], outputs: ["closed"], exportAs: ["ngsMenu"] }, { kind: "directive", type: MenuContent, selector: "[ngsMenuContent]" }, { kind: "directive", type: MenuOptionGroupDirective, selector: "[ngsMenuOptionGroup]", inputs: ["multiple"], outputs: ["valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MenuItem, selector: "ngs-menu-item, [ngs-menu-item]", inputs: ["disabled", "role", "selected"], outputs: ["_triggered"], exportAs: ["ngsMenuItem"] }, { kind: "component", type: FormField, selector: "ngs-form-field", inputs: ["subscriptHiddenIfEmpty"], exportAs: ["ngsFormField"] }, { kind: "component", type: Select, selector: "ngs-select", inputs: ["id", "placeholder", "disabled", "required", "multiple", "hideCheckIcon", "ariaLabel", "tabIndex", "aria-describedby", "value"], outputs: ["selectionChange", "opened", "closed", "valueChange"], exportAs: ["ngsSelect"] }, { kind: "component", type: Option, selector: "ngs-option", inputs: ["value", "disabled", "selected"], outputs: ["onSelectionChange"], exportAs: ["ngsOption"] }, { kind: "directive", type: AutoFocusDirective, selector: "[ngsAutoFocus]", inputs: ["ngsAutoFocus"], exportAs: ["ngsAutoFocus"] }, { kind: "directive", type: FocusElementDirective, selector: "[ngsFocusElement]", inputs: ["checkChildren"], outputs: ["elementFocused", "elementBlurred"], exportAs: ["ngsFocusElement"] }, { kind: "directive", type: Input, selector: "input[ngsInput], textarea[ngsInput]", inputs: ["id", "placeholder", "required", "disabled", "readonly", "errorStateMatcher"], exportAs: ["ngsInput"] }, { kind: "directive", type: FilterBuilderOperationDefDirective, selector: "[ngsFilterBuilderOperationDef]", inputs: ["ngsFilterBuilderOperationDef", "allowedDataTypes"] }, { kind: "directive", type: FilterBuilderOperationNameDirective, selector: "[ngsFilterBuilderOperationName]" }] });
|
|
315
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: FilterBuilder, isStandalone: true, selector: "ngs-filter-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, fieldDefs: { classPropertyName: "fieldDefs", publicName: "fieldDefs", isSignal: true, isRequired: false, transformFunction: null }, categories: { classPropertyName: "categories", publicName: "categories", isSignal: true, isRequired: false, transformFunction: null }, groupOperations: { classPropertyName: "groupOperations", publicName: "groupOperations", isSignal: true, isRequired: false, transformFunction: null }, customOperations: { classPropertyName: "customOperations", publicName: "customOperations", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChanged: "valueChanged" }, host: { classAttribute: "ngs-filter-builder" }, queries: [{ propertyName: "_customOperationDefs", predicate: FilterBuilderOperationDefDirective, isSignal: true }], viewQueries: [{ propertyName: "_prebuiltOperationDefs", predicate: FilterBuilderOperationDefDirective, descendants: true, isSignal: true }], exportAs: ["ngsFilterBuilder"], ngImport: i0, template: "@if (_isServer) {\n <ng-content/>\n}\n\n<ng-template #itemsTpl let-items>\n <div class=\"group\">\n @for (item of items; track item; let index = $index) {\n @if (_isGroup(item)) {\n <div class=\"flex items-center group-operations\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button [ngsMenuTriggerFor]=\"nestedGroupOperationsMenu\"\n #nestedGroupOperationsMenuTrigger=\"ngsMenuTrigger\"\n class=\"group-operation\">\n {{ getSelectedGroupOperationName(item) }}\n </button>\n <div [ngsMenuTriggerFor]=\"addGroupMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n <ngs-menu #nestedGroupOperationsMenu=\"ngsMenu\">\n <div ngsMenuOptionGroup [(ngModel)]=\"item['logicalOperator']\">\n @for (groupOperation of groupOperations(); track groupOperation.id) {\n <ngs-option [value]=\"groupOperation.id\"\n (click)=\"nestedGroupOperationsMenuTrigger.closeMenu('click')\">{{ groupOperation.name }}\n </ngs-option>\n }\n </div>\n </ngs-menu>\n <ngs-menu #addGroupMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"addCondition(item)\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup(item)\">Add Group</button>\n </ngs-menu>\n </div>\n @if (item['value'].length > 0) {\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: item['value'] }\"/>\n }\n } @else if (_isCondition(item)) {\n <div class=\"condition\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button class=\"condition-field\"\n #fieldsMenuTrigger=\"ngsMenuTrigger\"\n [ngsMenuTriggerFor]=\"fieldsMenu\">{{ getConditionField(item['value'][0])?.name }}\n </button>\n <button class=\"condition-operation\"\n #operationsMenuTrigger=\"ngsMenuTrigger\"\n [ngsMenuTriggerFor]=\"operationsMenu\">\n <ng-template [ngTemplateOutlet]=\"getConditionOperation(item['value'][1])?.name\"/>\n </button>\n <div class=\"relative\">\n @if (editItem && editItem === item) {\n <div class=\"absolute start-0 top-0 -translate-y-1/2\">\n @switch (getFieldType(editItem)) {\n @case ('array') {\n @switch (editItem['value'][1]) {\n @case ('equals') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\"\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n @case ('isAnyOf') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\" multiple\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"_tempMultipleValue\"\n (closed)=\"selectClosed()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n }\n }\n @case ('number') {\n @switch (editItem['value'][1]) {\n @case ('isBetween') {\n <div class=\"flex gap-2 items-center\"\n ngsFocusElement (elementBlurred)=\"cancelEdit()\">\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n [(ngModel)]=\"item['value'][2][0]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n <div class=\"text-neutral-500\">–</div>\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput\n [(ngModel)]=\"item['value'][2][1]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n </div>\n }\n @default {\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n }\n @default {\n <ngs-form-field class=\"form-field\">\n <input type=\"text\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n </div>\n } @else {\n @if (item['value'][1] !== 'isBlank' && item['value'][1] !== 'isNotBlank') {\n @if (isValueNotEmpty(item)) {\n @if (getFieldType(item) === 'array') {\n @if (item['value'][1] === 'equals') {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n {{ getDataSourceItemNameById(item, item['value'][2]) }}\n </button>\n } @else {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n @for (dataSourceItemId of item['value'][2]; track dataSourceItemId; let last = $last) {\n <span>{{ getDataSourceItemNameById(item, dataSourceItemId) }}</span>\n @if (!last) {\n <span class=\"text-neutral-500\">|</span>\n }\n }\n </button>\n }\n } @else {\n @if (item['value'][1] === 'isBetween') {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2][0] }}</span>\n <span class=\"text-neutral-500\">–</span>\n <span>{{ item['value'][2][1] }}</span>\n </button>\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2] }}</span>\n </button>\n }\n }\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span i18n><enter a value></span>\n </button>\n }\n }\n }\n </div>\n </div>\n <ngs-menu #fieldsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][0]\">\n @for (fieldDef of fieldDefs(); track fieldDef) {\n <ngs-option [value]=\"fieldDef.dataField\"\n (click)=\"selectConditionField(item, fieldDef); fieldsMenuTrigger.closeMenu('click')\">{{ fieldDef.name }}\n </ngs-option>\n }\n </div>\n </ng-template>\n </ngs-menu>\n <ngs-menu #operationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][1]\">\n @for (operation of _operationDefs; track operation.id()) {\n <div [hidden]=\"!isOperationAllowedForCondition(item['value'][0], operation.id())\">\n <ngs-option [value]=\"operation.id()\"\n (click)=\"operationChanged(item, operation.id()); operationsMenuTrigger.closeMenu('click')\">\n <div class=\"flex items-center gap-3\">\n @if (operation.operationIcon()) {\n <ng-template [ngTemplateOutlet]=\"operationIconTemplateRef(operation)\"/>\n }\n <div>\n <ng-template [ngTemplateOutlet]=\"operationNameTemplateRef(operation)\"/>\n </div>\n </div>\n </ngs-option>\n </div>\n }\n </div>\n </ng-template>\n </ngs-menu>\n }\n }\n </div>\n</ng-template>\n\n<div class=\"group\">\n <div class=\"flex items-center group-operations\">\n <button [ngsMenuTriggerFor]=\"groupOperationsMenu\"\n #groupOperationsMenuTrigger=\"ngsMenuTrigger\"\n class=\"group-operation\">\n {{ getSelectedGroupOperationName() }}\n </button>\n <div [ngsMenuTriggerFor]=\"addMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n </div>\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: _value }\"/>\n</div>\n\n<ngs-menu #groupOperationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"_logicalOperator\" (ngModelChange)=\"_emitChangeEvent()\">\n @for (operation of groupOperations(); track operation.id) {\n <ngs-option [value]=\"operation.id\"\n (click)=\"groupOperationsMenuTrigger.closeMenu('click')\">{{ operation.name }}\n </ngs-option>\n }\n </div>\n </ng-template>\n</ngs-menu>\n<ngs-menu #addMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <button ngs-menu-item (click)=\"addCondition()\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup()\">Add Group</button>\n </ng-template>\n</ngs-menu>\n\n<ng-container ngsFilterBuilderOperationDef=\"contains\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Contains</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"doesNotContain\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Does not contain</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"startsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Starts with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"endsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Ends with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"equals\" [allowedDataTypes]=\"['string', 'number', 'array', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"notEquals\" [allowedDataTypes]=\"['string', 'number', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Not equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isNotBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is not blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBetween\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is between</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isAnyOf\" [allowedDataTypes]=\"['array']\">\n <ng-template ngsFilterBuilderOperationName>Is any of</ng-template>\n</ng-container>\n", styles: [":host{--ngs-filter-builder-group-operations-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-font-size: var(--text-tiny);--ngs-filter-builder-group-operation-color: var(--color-on-surface);--ngs-filter-builder-group-operation-bg: var(--color-surface-container);--ngs-filter-builder-group-operation-font-weight: 400;--ngs-filter-builder-group-operation-border-radius: .5rem;--ngs-filter-builder-group-operation-bpadding: 0 calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-group-operation-hover-color: var(--color-on-surface);--ngs-filter-builder-group-operation-hover-bg: var(--color-surface-container-high);--ngs-filter-builder-group-operation-active-color: var(--color-on-surface);--ngs-filter-builder-group-operation-active-bg: var(--color-surface-container-highest);--ngs-filter-builder-group-operation-border: 1px solid var(--color-border);--ngs-filter-builder-group-add-color: var(--color-primary);--ngs-filter-builder-group-add-hover-color: var(--color-primary);--ngs-filter-builder-group-margin: 0;--ngs-filter-builder-group-padding: 0;--ngs-filter-builder-group-gap: calc(var(--spacing, .25rem) * 4);--ngs-filter-builder-condition-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-field-font-size: var(--text-tiny);--ngs-filter-builder-condition-field-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-bg: var(--color-primary-container);--ngs-filter-builder-condition-field-font-weight: 400;--ngs-filter-builder-condition-field-border-radius: .5rem;--ngs-filter-builder-condition-field-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-hover-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-hover-bg: var(--color-primary-400);--ngs-filter-builder-condition-field-active-color: var(--color-on-primary);--ngs-filter-builder-condition-field-active-bg: var(--color-primary);--ngs-filter-builder-condition-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-operation-font-size: var(--text-tiny);--ngs-filter-builder-condition-operation-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-bg: var(--color-secondary-container);--ngs-filter-builder-condition-operation-font-weight: 400;--ngs-filter-builder-condition-operation-border-radius: .5rem;--ngs-filter-builder-condition-operation-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-operation-hover-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-hover-bg: var(--color-secondary-400);--ngs-filter-builder-condition-operation-active-color: var(--color-on-secondary);--ngs-filter-builder-condition-operation-active-bg: var(--color-secondary);--ngs-filter-builder-condition-value-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-value-font-size: var(--text-tiny);--ngs-filter-builder-condition-value-color: var(--color-on-surface);--ngs-filter-builder-condition-value-bg: var(--color-surface-container-high);--ngs-filter-builder-condition-value-font-weight: 400;--ngs-filter-builder-condition-value-border-radius: .5rem;--ngs-filter-builder-condition-value-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-value-hover-color: var(--color-on-surface);--ngs-filter-builder-condition-value-hover-bg: var(--color-surface-container-highest);--ngs-filter-builder-condition-remove-color: var(--color-error);--ngs-filter-builder-condition-remove-hover-color: var(--color-error);display:block}:host ::ng-deep .ngs-form-field-infix{--ngs-form-field-container-height: 46px !important;--ngs-form-field-container-vertical-padding: 12px !important}:host ::ng-deep .subscript-wrapper{display:none}:host .form-field{width:200px}:host .form-field-number{width:140px}:host .group-operations{gap:var(--ngs-filter-builder-group-operations-gap)}:host .group{margin:var(--ngs-filter-builder-group-margin);padding:var(--ngs-filter-builder-group-padding);display:flex;flex-direction:column;gap:var(--ngs-filter-builder-group-gap)}:host .group .group{margin-left:calc(var(--spacing, .25rem) * 4)}:host .icon:empty{display:none}:host .group-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-group-operation-height);font-size:var(--ngs-filter-builder-group-operation-font-size);font-weight:var(--ngs-filter-builder-group-operation-font-weight);color:var(--ngs-filter-builder-group-operation-color);background:var(--ngs-filter-builder-group-operation-bg);border:var(--ngs-filter-builder-group-operation-border);border-radius:var(--ngs-filter-builder-group-operation-border-radius);padding:var(--ngs-filter-builder-group-operation-bpadding)}:host .group-operation:hover{color:var(--ngs-filter-builder-group-operation-hover-color);background:var(--ngs-filter-builder-group-operation-hover-bg)}:host .group-operation:active,:host .group-operation.active{color:var(--ngs-filter-builder-group-operation-active-color);background:var(--ngs-filter-builder-group-operation-active-bg)}:host .condition{display:flex;align-items:center;gap:var(--ngs-filter-builder-condition-gap)}:host .condition-field{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-field-height);font-size:var(--ngs-filter-builder-condition-field-font-size);font-weight:var(--ngs-filter-builder-condition-field-font-weight);color:var(--ngs-filter-builder-condition-field-color);background:var(--ngs-filter-builder-condition-field-bg);border-radius:var(--ngs-filter-builder-condition-field-border-radius);padding:var(--ngs-filter-builder-condition-field-bpadding)}:host .condition-field:hover{color:var(--ngs-filter-builder-condition-field-hover-color);background:var(--ngs-filter-builder-condition-field-hover-bg)}:host .add{line-height:0;color:var(--ngs-filter-builder-group-add-color);cursor:pointer}:host .add:hover{color:var(--ngs-filter-builder-group-add-hover-color)}:host .remove{line-height:0;color:var(--ngs-filter-builder-condition-remove-color);cursor:pointer}:host .remove:hover{color:var(--ngs-filter-builder-condition-remove-hover-color)}:host .condition-field:active,:host .condition-field.active{color:var(--ngs-filter-builder-condition-field-active-color);background:var(--ngs-filter-builder-condition-field-active-bg)}:host .condition-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-operation-height);font-size:var(--ngs-filter-builder-condition-operation-font-size);font-weight:var(--ngs-filter-builder-condition-operation-font-weight);color:var(--ngs-filter-builder-condition-operation-color);background:var(--ngs-filter-builder-condition-operation-bg);border-radius:var(--ngs-filter-builder-condition-operation-border-radius);padding:var(--ngs-filter-builder-condition-operation-bpadding)}:host .condition-operation:hover{color:var(--ngs-filter-builder-condition-operation-hover-color);background:var(--ngs-filter-builder-condition-operation-hover-bg)}:host .condition-operation:active,:host .condition-operation.active{color:var(--ngs-filter-builder-condition-operation-active-color);background:var(--ngs-filter-builder-condition-operation-active-bg)}:host .condition-value{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-value-height);font-size:var(--ngs-filter-builder-condition-value-font-size);font-weight:var(--ngs-filter-builder-condition-value-font-weight);color:var(--ngs-filter-builder-condition-value-color);background:var(--ngs-filter-builder-condition-value-bg);border-radius:var(--ngs-filter-builder-condition-value-border-radius);padding:var(--ngs-filter-builder-condition-value-bpadding)}:host .condition-value:hover{color:var(--ngs-filter-builder-condition-value-hover-color);background:var(--ngs-filter-builder-condition-value-hover-bg)}:host-context(html.dark){--ngs-filter-builder-group-operation-color: var(--color-neutral-200);--ngs-filter-builder-group-operation-hover-bg: var(--color-neutral-600);--ngs-filter-builder-group-operation-active-bg: var(--color-neutral-650);--ngs-filter-builder-group-operation-hover-color: var(--color-neutral-100);--ngs-filter-builder-group-operation-active-color: var(--color-neutral-50)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Icon, selector: "ngs-icon", inputs: ["name"], exportAs: ["ngsIcon"] }, { kind: "directive", type: MenuTrigger, selector: "[ngsMenuTriggerFor]", inputs: ["ngsMenuTriggerFor", "ngsMenuTriggerData", "ngsMenuDisabled", "xPosition", "yPosition", "ngsMenuTriggerRestoreFocus"], outputs: ["menuOpened", "menuClosed"], exportAs: ["ngsMenuTrigger"] }, { kind: "component", type: Menu, selector: "ngs-menu", inputs: ["role", "classList", "xPosition", "yPosition"], outputs: ["closed"], exportAs: ["ngsMenu"] }, { kind: "directive", type: MenuContent, selector: "[ngsMenuContent]" }, { kind: "directive", type: MenuOptionGroupDirective, selector: "[ngsMenuOptionGroup]", inputs: ["multiple"], outputs: ["valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MenuItem, selector: "ngs-menu-item, [ngs-menu-item]", inputs: ["disabled", "role", "selected"], outputs: ["_triggered"], exportAs: ["ngsMenuItem"] }, { kind: "component", type: FormField, selector: "ngs-form-field", inputs: ["subscriptHiddenIfEmpty"], exportAs: ["ngsFormField"] }, { kind: "component", type: Select, selector: "ngs-select", inputs: ["id", "placeholder", "disabled", "required", "multiple", "hideCheckIcon", "ariaLabel", "tabIndex", "aria-describedby", "value"], outputs: ["selectionChange", "opened", "closed", "valueChange"], exportAs: ["ngsSelect"] }, { kind: "component", type: Option, selector: "ngs-option", inputs: ["value", "disabled", "selected"], outputs: ["onSelectionChange"], exportAs: ["ngsOption"] }, { kind: "directive", type: AutoFocusDirective, selector: "[ngsAutoFocus]", inputs: ["ngsAutoFocus"], exportAs: ["ngsAutoFocus"] }, { kind: "directive", type: FocusElementDirective, selector: "[ngsFocusElement]", inputs: ["checkChildren"], outputs: ["elementFocused", "elementBlurred"], exportAs: ["ngsFocusElement"] }, { kind: "directive", type: Input, selector: "input[ngsInput], textarea[ngsInput]", inputs: ["id", "placeholder", "required", "disabled", "readonly", "errorStateMatcher"], exportAs: ["ngsInput"] }, { kind: "directive", type: FilterBuilderOperationDefDirective, selector: "[ngsFilterBuilderOperationDef]", inputs: ["ngsFilterBuilderOperationDef", "allowedDataTypes"] }, { kind: "directive", type: FilterBuilderOperationNameDirective, selector: "[ngsFilterBuilderOperationName]" }] });
|
|
303
316
|
}
|
|
304
317
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: FilterBuilder, decorators: [{
|
|
305
318
|
type: Component,
|
|
@@ -322,7 +335,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
322
335
|
FilterBuilderOperationNameDirective
|
|
323
336
|
], host: {
|
|
324
337
|
'class': 'ngs-filter-builder'
|
|
325
|
-
}, template: "@if (_isServer) {\n <ng-content/>\n}\n\n<ng-template #itemsTpl let-items>\n <div class=\"group\">\n @for (item of items; track item; let index = $index) {\n @if (_isGroup(item)) {\n <div class=\"flex items-center group-operations\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button [ngsMenuTriggerFor]=\"nestedGroupOperationsMenu\" class=\"group-operation\">\n {{ getSelectedGroupOperationName(item) }}\n </button>\n <div [ngsMenuTriggerFor]=\"addGroupMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n <ngs-menu #nestedGroupOperationsMenu=\"ngsMenu\">\n <div ngsMenuOptionGroup [(ngModel)]=\"item['logicalOperator']\">\n @for (groupOperation of groupOperations(); track groupOperation.id) {\n <ngs-option [value]=\"groupOperation.id\">{{ groupOperation.name }}</ngs-option>\n }\n </div>\n </ngs-menu>\n <ngs-menu #addGroupMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"addCondition(item)\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup(item)\">Add Group</button>\n </ngs-menu>\n </div>\n @if (item['value'].length > 0) {\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: item['value'] }\" />\n }\n } @else if (_isCondition(item)) {\n <div class=\"condition\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button class=\"condition-field\"\n [ngsMenuTriggerFor]=\"fieldsMenu\">{{ getConditionField(item['value'][0])?.name }}</button>\n <button class=\"condition-operation\"\n [ngsMenuTriggerFor]=\"operationsMenu\">\n <ng-template [ngTemplateOutlet]=\"getConditionOperation(item['value'][1])?.name\" />\n </button>\n <div class=\"relative\">\n @if (editItem && editItem === item) {\n <div class=\"absolute start-0 top-0 -translate-y-1/2\">\n @switch (getFieldType(editItem)) {\n @case ('array') {\n @switch (editItem['value'][1]) {\n @case ('equals') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\"\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n\n @case ('isAnyOf') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\" multiple\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (closed)=\"selectClosed()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n }\n }\n\n @case ('number') {\n @switch (editItem['value'][1]) {\n @case ('isBetween') {\n <div class=\"flex gap-2 items-center\"\n ngsFocusElement (elementBlurred)=\"cancelEdit()\">\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n [(ngModel)]=\"item['value'][2][0]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n <div class=\"text-neutral-500\">–</div>\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput\n [(ngModel)]=\"item['value'][2][1]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n </div>\n }\n @default {\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n }\n\n @default {\n <ngs-form-field class=\"form-field\">\n <input type=\"text\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n </div>\n } @else {\n @if (item['value'][1] !== 'isBlank' && item['value'][1] !== 'isNotBlank') {\n @if (isValueNotEmpty(item)) {\n @if (getFieldType(item) === 'array') {\n @if (item['value'][1] === 'equals') {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n {{ getDataSourceItemNameById(item, item['value'][2]) }}\n </button>\n } @else {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n @for (dataSourceItemId of item['value'][2]; track dataSourceItemId; let last = $last) {\n <span>{{ getDataSourceItemNameById(item, dataSourceItemId) }}</span>\n @if (!last) {\n <span class=\"text-neutral-500\">|</span>\n }\n }\n </button>\n }\n } @else {\n @if (item['value'][1] === 'isBetween') {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2][0] }}</span>\n <span class=\"text-neutral-500\">–</span>\n <span>{{ item['value'][2][1] }}</span>\n </button>\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2] }}</span>\n </button>\n }\n }\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span i18n><enter a value></span>\n </button>\n }\n }\n }\n </div>\n </div>\n <ngs-menu #fieldsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"item['value'][0]\">\n @for (fieldDef of fieldDefs(); track fieldDef) {\n <ngs-option [value]=\"fieldDef.dataField\"\n (click)=\"selectConditionField(item, fieldDef)\">{{ fieldDef.name }}</ngs-option>\n }\n </div>\n </ng-template>\n </ngs-menu>\n <ngs-menu #operationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][1]\">\n @for (operation of _operationDefs; track operation.id()) {\n <div [hidden]=\"!isOperationAllowedForCondition(item['value'][0], operation.id())\">\n <ngs-option [value]=\"operation.id()\" (click)=\"operationChanged(item, operation.id())\">\n <div class=\"flex items-center gap-3\">\n @if (operation.operationIcon()) {\n <ng-template [ngTemplateOutlet]=\"operationIconTemplateRef(operation)\" />\n }\n <div>\n <ng-template [ngTemplateOutlet]=\"operationNameTemplateRef(operation)\" />\n </div>\n </div>\n </ngs-option>\n </div>\n }\n </div>\n </ng-template>\n </ngs-menu>\n }\n }\n </div>\n</ng-template>\n\n<div class=\"group\">\n <div class=\"flex items-center group-operations\">\n <button [ngsMenuTriggerFor]=\"groupOperationsMenu\" class=\"group-operation\">\n {{ getSelectedGroupOperationName() }}\n </button>\n <div [ngsMenuTriggerFor]=\"addMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n </div>\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: _value }\" />\n</div>\n\n<ngs-menu #groupOperationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"_logicalOperator\" (ngModelChange)=\"_emitChangeEvent()\">\n @for (operation of groupOperations(); track operation.id) {\n <ngs-option [value]=\"operation.id\">{{ operation.name }}</ngs-option>\n }\n </div>\n </ng-template>\n</ngs-menu>\n<ngs-menu #addMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <button ngs-menu-item (click)=\"addCondition()\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup()\">Add Group</button>\n </ng-template>\n</ngs-menu>\n\n<ng-container ngsFilterBuilderOperationDef=\"contains\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Contains</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"doesNotContain\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Does not contain</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"startsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Starts with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"endsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Ends with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"equals\" [allowedDataTypes]=\"['string', 'number', 'array', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"notEquals\" [allowedDataTypes]=\"['string', 'number', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Not equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isNotBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is not blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBetween\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is between</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isAnyOf\" [allowedDataTypes]=\"['array']\">\n <ng-template ngsFilterBuilderOperationName>Is any of</ng-template>\n</ng-container>\n", styles: [":host{--ngs-filter-builder-group-operations-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-font-size: var(--text-tiny);--ngs-filter-builder-group-operation-color: var(--color-on-surface);--ngs-filter-builder-group-operation-bg: var(--color-surface-container);--ngs-filter-builder-group-operation-font-weight: 400;--ngs-filter-builder-group-operation-border-radius: .5rem;--ngs-filter-builder-group-operation-bpadding: 0 calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-group-operation-hover-color: var(--color-on-surface);--ngs-filter-builder-group-operation-hover-bg: var(--color-surface-container-high);--ngs-filter-builder-group-operation-active-color: var(--color-on-surface);--ngs-filter-builder-group-operation-active-bg: var(--color-surface-container-highest);--ngs-filter-builder-group-operation-border: 1px solid var(--color-outline-variant);--ngs-filter-builder-group-add-color: var(--color-primary);--ngs-filter-builder-group-add-hover-color: var(--color-primary);--ngs-filter-builder-group-margin: 0;--ngs-filter-builder-group-padding: 0;--ngs-filter-builder-group-gap: calc(var(--spacing, .25rem) * 4);--ngs-filter-builder-condition-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-field-font-size: var(--text-tiny);--ngs-filter-builder-condition-field-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-bg: var(--color-primary-container);--ngs-filter-builder-condition-field-font-weight: 400;--ngs-filter-builder-condition-field-border-radius: .5rem;--ngs-filter-builder-condition-field-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-hover-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-hover-bg: var(--color-primary-400);--ngs-filter-builder-condition-field-active-color: var(--color-on-primary);--ngs-filter-builder-condition-field-active-bg: var(--color-primary);--ngs-filter-builder-condition-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-operation-font-size: var(--text-tiny);--ngs-filter-builder-condition-operation-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-bg: var(--color-secondary-container);--ngs-filter-builder-condition-operation-font-weight: 400;--ngs-filter-builder-condition-operation-border-radius: .5rem;--ngs-filter-builder-condition-operation-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-operation-hover-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-hover-bg: var(--color-secondary-400);--ngs-filter-builder-condition-operation-active-color: var(--color-on-secondary);--ngs-filter-builder-condition-operation-active-bg: var(--color-secondary);--ngs-filter-builder-condition-value-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-value-font-size: var(--text-tiny);--ngs-filter-builder-condition-value-color: var(--color-on-surface);--ngs-filter-builder-condition-value-bg: var(--color-surface-container-high);--ngs-filter-builder-condition-value-font-weight: 400;--ngs-filter-builder-condition-value-border-radius: .5rem;--ngs-filter-builder-condition-value-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-value-hover-color: var(--color-on-surface);--ngs-filter-builder-condition-value-hover-bg: var(--color-surface-container-highest);--ngs-filter-builder-condition-remove-color: var(--color-error);--ngs-filter-builder-condition-remove-hover-color: var(--color-error);display:block}:host ::ng-deep .ngs-form-field-infix{--ngs-form-field-container-height: 46px !important;--ngs-form-field-container-vertical-padding: 12px !important}:host ::ng-deep .subscript-wrapper{display:none}:host .form-field{width:200px}:host .form-field-number{width:140px}:host .group-operations{gap:var(--ngs-filter-builder-group-operations-gap)}:host .group{margin:var(--ngs-filter-builder-group-margin);padding:var(--ngs-filter-builder-group-padding);display:flex;flex-direction:column;gap:var(--ngs-filter-builder-group-gap)}:host .group .group{margin-left:calc(var(--spacing, .25rem) * 4)}:host .icon:empty{display:none}:host .group-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-group-operation-height);font-size:var(--ngs-filter-builder-group-operation-font-size);font-weight:var(--ngs-filter-builder-group-operation-font-weight);color:var(--ngs-filter-builder-group-operation-color);background:var(--ngs-filter-builder-group-operation-bg);border:var(--ngs-filter-builder-group-operation-border);border-radius:var(--ngs-filter-builder-group-operation-border-radius);padding:var(--ngs-filter-builder-group-operation-bpadding)}:host .group-operation:hover{color:var(--ngs-filter-builder-group-operation-hover-color);background:var(--ngs-filter-builder-group-operation-hover-bg)}:host .group-operation:active,:host .group-operation.active{color:var(--ngs-filter-builder-group-operation-active-color);background:var(--ngs-filter-builder-group-operation-active-bg)}:host .condition{display:flex;align-items:center;gap:var(--ngs-filter-builder-condition-gap)}:host .condition-field{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-field-height);font-size:var(--ngs-filter-builder-condition-field-font-size);font-weight:var(--ngs-filter-builder-condition-field-font-weight);color:var(--ngs-filter-builder-condition-field-color);background:var(--ngs-filter-builder-condition-field-bg);border-radius:var(--ngs-filter-builder-condition-field-border-radius);padding:var(--ngs-filter-builder-condition-field-bpadding)}:host .condition-field:hover{color:var(--ngs-filter-builder-condition-field-hover-color);background:var(--ngs-filter-builder-condition-field-hover-bg)}:host .add{line-height:0;color:var(--ngs-filter-builder-group-add-color);cursor:pointer}:host .add:hover{color:var(--ngs-filter-builder-group-add-hover-color)}:host .remove{line-height:0;color:var(--ngs-filter-builder-condition-remove-color);cursor:pointer}:host .remove:hover{color:var(--ngs-filter-builder-condition-remove-hover-color)}:host .condition-field:active,:host .condition-field.active{color:var(--ngs-filter-builder-condition-field-active-color);background:var(--ngs-filter-builder-condition-field-active-bg)}:host .condition-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-operation-height);font-size:var(--ngs-filter-builder-condition-operation-font-size);font-weight:var(--ngs-filter-builder-condition-operation-font-weight);color:var(--ngs-filter-builder-condition-operation-color);background:var(--ngs-filter-builder-condition-operation-bg);border-radius:var(--ngs-filter-builder-condition-operation-border-radius);padding:var(--ngs-filter-builder-condition-operation-bpadding)}:host .condition-operation:hover{color:var(--ngs-filter-builder-condition-operation-hover-color);background:var(--ngs-filter-builder-condition-operation-hover-bg)}:host .condition-operation:active,:host .condition-operation.active{color:var(--ngs-filter-builder-condition-operation-active-color);background:var(--ngs-filter-builder-condition-operation-active-bg)}:host .condition-value{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-value-height);font-size:var(--ngs-filter-builder-condition-value-font-size);font-weight:var(--ngs-filter-builder-condition-value-font-weight);color:var(--ngs-filter-builder-condition-value-color);background:var(--ngs-filter-builder-condition-value-bg);border-radius:var(--ngs-filter-builder-condition-value-border-radius);padding:var(--ngs-filter-builder-condition-value-bpadding)}:host .condition-value:hover{color:var(--ngs-filter-builder-condition-value-hover-color);background:var(--ngs-filter-builder-condition-value-hover-bg)}:host-context(html.dark){--ngs-filter-builder-group-operation-color: var(--color-neutral-200);--ngs-filter-builder-group-operation-hover-bg: var(--color-neutral-600);--ngs-filter-builder-group-operation-active-bg: var(--color-neutral-650);--ngs-filter-builder-group-operation-hover-color: var(--color-neutral-100);--ngs-filter-builder-group-operation-active-color: var(--color-neutral-50)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
338
|
+
}, template: "@if (_isServer) {\n <ng-content/>\n}\n\n<ng-template #itemsTpl let-items>\n <div class=\"group\">\n @for (item of items; track item; let index = $index) {\n @if (_isGroup(item)) {\n <div class=\"flex items-center group-operations\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button [ngsMenuTriggerFor]=\"nestedGroupOperationsMenu\"\n #nestedGroupOperationsMenuTrigger=\"ngsMenuTrigger\"\n class=\"group-operation\">\n {{ getSelectedGroupOperationName(item) }}\n </button>\n <div [ngsMenuTriggerFor]=\"addGroupMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n <ngs-menu #nestedGroupOperationsMenu=\"ngsMenu\">\n <div ngsMenuOptionGroup [(ngModel)]=\"item['logicalOperator']\">\n @for (groupOperation of groupOperations(); track groupOperation.id) {\n <ngs-option [value]=\"groupOperation.id\"\n (click)=\"nestedGroupOperationsMenuTrigger.closeMenu('click')\">{{ groupOperation.name }}\n </ngs-option>\n }\n </div>\n </ngs-menu>\n <ngs-menu #addGroupMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"addCondition(item)\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup(item)\">Add Group</button>\n </ngs-menu>\n </div>\n @if (item['value'].length > 0) {\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: item['value'] }\"/>\n }\n } @else if (_isCondition(item)) {\n <div class=\"condition\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button class=\"condition-field\"\n #fieldsMenuTrigger=\"ngsMenuTrigger\"\n [ngsMenuTriggerFor]=\"fieldsMenu\">{{ getConditionField(item['value'][0])?.name }}\n </button>\n <button class=\"condition-operation\"\n #operationsMenuTrigger=\"ngsMenuTrigger\"\n [ngsMenuTriggerFor]=\"operationsMenu\">\n <ng-template [ngTemplateOutlet]=\"getConditionOperation(item['value'][1])?.name\"/>\n </button>\n <div class=\"relative\">\n @if (editItem && editItem === item) {\n <div class=\"absolute start-0 top-0 -translate-y-1/2\">\n @switch (getFieldType(editItem)) {\n @case ('array') {\n @switch (editItem['value'][1]) {\n @case ('equals') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\"\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n @case ('isAnyOf') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\" multiple\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"_tempMultipleValue\"\n (closed)=\"selectClosed()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n }\n }\n @case ('number') {\n @switch (editItem['value'][1]) {\n @case ('isBetween') {\n <div class=\"flex gap-2 items-center\"\n ngsFocusElement (elementBlurred)=\"cancelEdit()\">\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n [(ngModel)]=\"item['value'][2][0]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n <div class=\"text-neutral-500\">–</div>\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput\n [(ngModel)]=\"item['value'][2][1]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n </div>\n }\n @default {\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n }\n @default {\n <ngs-form-field class=\"form-field\">\n <input type=\"text\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n </div>\n } @else {\n @if (item['value'][1] !== 'isBlank' && item['value'][1] !== 'isNotBlank') {\n @if (isValueNotEmpty(item)) {\n @if (getFieldType(item) === 'array') {\n @if (item['value'][1] === 'equals') {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n {{ getDataSourceItemNameById(item, item['value'][2]) }}\n </button>\n } @else {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n @for (dataSourceItemId of item['value'][2]; track dataSourceItemId; let last = $last) {\n <span>{{ getDataSourceItemNameById(item, dataSourceItemId) }}</span>\n @if (!last) {\n <span class=\"text-neutral-500\">|</span>\n }\n }\n </button>\n }\n } @else {\n @if (item['value'][1] === 'isBetween') {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2][0] }}</span>\n <span class=\"text-neutral-500\">–</span>\n <span>{{ item['value'][2][1] }}</span>\n </button>\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2] }}</span>\n </button>\n }\n }\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span i18n><enter a value></span>\n </button>\n }\n }\n }\n </div>\n </div>\n <ngs-menu #fieldsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][0]\">\n @for (fieldDef of fieldDefs(); track fieldDef) {\n <ngs-option [value]=\"fieldDef.dataField\"\n (click)=\"selectConditionField(item, fieldDef); fieldsMenuTrigger.closeMenu('click')\">{{ fieldDef.name }}\n </ngs-option>\n }\n </div>\n </ng-template>\n </ngs-menu>\n <ngs-menu #operationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][1]\">\n @for (operation of _operationDefs; track operation.id()) {\n <div [hidden]=\"!isOperationAllowedForCondition(item['value'][0], operation.id())\">\n <ngs-option [value]=\"operation.id()\"\n (click)=\"operationChanged(item, operation.id()); operationsMenuTrigger.closeMenu('click')\">\n <div class=\"flex items-center gap-3\">\n @if (operation.operationIcon()) {\n <ng-template [ngTemplateOutlet]=\"operationIconTemplateRef(operation)\"/>\n }\n <div>\n <ng-template [ngTemplateOutlet]=\"operationNameTemplateRef(operation)\"/>\n </div>\n </div>\n </ngs-option>\n </div>\n }\n </div>\n </ng-template>\n </ngs-menu>\n }\n }\n </div>\n</ng-template>\n\n<div class=\"group\">\n <div class=\"flex items-center group-operations\">\n <button [ngsMenuTriggerFor]=\"groupOperationsMenu\"\n #groupOperationsMenuTrigger=\"ngsMenuTrigger\"\n class=\"group-operation\">\n {{ getSelectedGroupOperationName() }}\n </button>\n <div [ngsMenuTriggerFor]=\"addMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n </div>\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: _value }\"/>\n</div>\n\n<ngs-menu #groupOperationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"_logicalOperator\" (ngModelChange)=\"_emitChangeEvent()\">\n @for (operation of groupOperations(); track operation.id) {\n <ngs-option [value]=\"operation.id\"\n (click)=\"groupOperationsMenuTrigger.closeMenu('click')\">{{ operation.name }}\n </ngs-option>\n }\n </div>\n </ng-template>\n</ngs-menu>\n<ngs-menu #addMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <button ngs-menu-item (click)=\"addCondition()\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup()\">Add Group</button>\n </ng-template>\n</ngs-menu>\n\n<ng-container ngsFilterBuilderOperationDef=\"contains\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Contains</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"doesNotContain\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Does not contain</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"startsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Starts with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"endsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Ends with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"equals\" [allowedDataTypes]=\"['string', 'number', 'array', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"notEquals\" [allowedDataTypes]=\"['string', 'number', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Not equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isNotBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is not blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBetween\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is between</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isAnyOf\" [allowedDataTypes]=\"['array']\">\n <ng-template ngsFilterBuilderOperationName>Is any of</ng-template>\n</ng-container>\n", styles: [":host{--ngs-filter-builder-group-operations-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-font-size: var(--text-tiny);--ngs-filter-builder-group-operation-color: var(--color-on-surface);--ngs-filter-builder-group-operation-bg: var(--color-surface-container);--ngs-filter-builder-group-operation-font-weight: 400;--ngs-filter-builder-group-operation-border-radius: .5rem;--ngs-filter-builder-group-operation-bpadding: 0 calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-group-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-group-operation-hover-color: var(--color-on-surface);--ngs-filter-builder-group-operation-hover-bg: var(--color-surface-container-high);--ngs-filter-builder-group-operation-active-color: var(--color-on-surface);--ngs-filter-builder-group-operation-active-bg: var(--color-surface-container-highest);--ngs-filter-builder-group-operation-border: 1px solid var(--color-border);--ngs-filter-builder-group-add-color: var(--color-primary);--ngs-filter-builder-group-add-hover-color: var(--color-primary);--ngs-filter-builder-group-margin: 0;--ngs-filter-builder-group-padding: 0;--ngs-filter-builder-group-gap: calc(var(--spacing, .25rem) * 4);--ngs-filter-builder-condition-gap: calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-field-font-size: var(--text-tiny);--ngs-filter-builder-condition-field-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-bg: var(--color-primary-container);--ngs-filter-builder-condition-field-font-weight: 400;--ngs-filter-builder-condition-field-border-radius: .5rem;--ngs-filter-builder-condition-field-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-field-hover-color: var(--color-on-primary-container);--ngs-filter-builder-condition-field-hover-bg: var(--color-primary-400);--ngs-filter-builder-condition-field-active-color: var(--color-on-primary);--ngs-filter-builder-condition-field-active-bg: var(--color-primary);--ngs-filter-builder-condition-operation-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-operation-font-size: var(--text-tiny);--ngs-filter-builder-condition-operation-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-bg: var(--color-secondary-container);--ngs-filter-builder-condition-operation-font-weight: 400;--ngs-filter-builder-condition-operation-border-radius: .5rem;--ngs-filter-builder-condition-operation-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-operation-hover-color: var(--color-on-secondary-container);--ngs-filter-builder-condition-operation-hover-bg: var(--color-secondary-400);--ngs-filter-builder-condition-operation-active-color: var(--color-on-secondary);--ngs-filter-builder-condition-operation-active-bg: var(--color-secondary);--ngs-filter-builder-condition-value-height: calc(var(--spacing, .25rem) * 7);--ngs-filter-builder-condition-value-font-size: var(--text-tiny);--ngs-filter-builder-condition-value-color: var(--color-on-surface);--ngs-filter-builder-condition-value-bg: var(--color-surface-container-high);--ngs-filter-builder-condition-value-font-weight: 400;--ngs-filter-builder-condition-value-border-radius: .5rem;--ngs-filter-builder-condition-value-bpadding: calc(var(--spacing, .25rem) * .5) calc(var(--spacing, .25rem) * 2);--ngs-filter-builder-condition-value-hover-color: var(--color-on-surface);--ngs-filter-builder-condition-value-hover-bg: var(--color-surface-container-highest);--ngs-filter-builder-condition-remove-color: var(--color-error);--ngs-filter-builder-condition-remove-hover-color: var(--color-error);display:block}:host ::ng-deep .ngs-form-field-infix{--ngs-form-field-container-height: 46px !important;--ngs-form-field-container-vertical-padding: 12px !important}:host ::ng-deep .subscript-wrapper{display:none}:host .form-field{width:200px}:host .form-field-number{width:140px}:host .group-operations{gap:var(--ngs-filter-builder-group-operations-gap)}:host .group{margin:var(--ngs-filter-builder-group-margin);padding:var(--ngs-filter-builder-group-padding);display:flex;flex-direction:column;gap:var(--ngs-filter-builder-group-gap)}:host .group .group{margin-left:calc(var(--spacing, .25rem) * 4)}:host .icon:empty{display:none}:host .group-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-group-operation-height);font-size:var(--ngs-filter-builder-group-operation-font-size);font-weight:var(--ngs-filter-builder-group-operation-font-weight);color:var(--ngs-filter-builder-group-operation-color);background:var(--ngs-filter-builder-group-operation-bg);border:var(--ngs-filter-builder-group-operation-border);border-radius:var(--ngs-filter-builder-group-operation-border-radius);padding:var(--ngs-filter-builder-group-operation-bpadding)}:host .group-operation:hover{color:var(--ngs-filter-builder-group-operation-hover-color);background:var(--ngs-filter-builder-group-operation-hover-bg)}:host .group-operation:active,:host .group-operation.active{color:var(--ngs-filter-builder-group-operation-active-color);background:var(--ngs-filter-builder-group-operation-active-bg)}:host .condition{display:flex;align-items:center;gap:var(--ngs-filter-builder-condition-gap)}:host .condition-field{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-field-height);font-size:var(--ngs-filter-builder-condition-field-font-size);font-weight:var(--ngs-filter-builder-condition-field-font-weight);color:var(--ngs-filter-builder-condition-field-color);background:var(--ngs-filter-builder-condition-field-bg);border-radius:var(--ngs-filter-builder-condition-field-border-radius);padding:var(--ngs-filter-builder-condition-field-bpadding)}:host .condition-field:hover{color:var(--ngs-filter-builder-condition-field-hover-color);background:var(--ngs-filter-builder-condition-field-hover-bg)}:host .add{line-height:0;color:var(--ngs-filter-builder-group-add-color);cursor:pointer}:host .add:hover{color:var(--ngs-filter-builder-group-add-hover-color)}:host .remove{line-height:0;color:var(--ngs-filter-builder-condition-remove-color);cursor:pointer}:host .remove:hover{color:var(--ngs-filter-builder-condition-remove-hover-color)}:host .condition-field:active,:host .condition-field.active{color:var(--ngs-filter-builder-condition-field-active-color);background:var(--ngs-filter-builder-condition-field-active-bg)}:host .condition-operation{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-operation-height);font-size:var(--ngs-filter-builder-condition-operation-font-size);font-weight:var(--ngs-filter-builder-condition-operation-font-weight);color:var(--ngs-filter-builder-condition-operation-color);background:var(--ngs-filter-builder-condition-operation-bg);border-radius:var(--ngs-filter-builder-condition-operation-border-radius);padding:var(--ngs-filter-builder-condition-operation-bpadding)}:host .condition-operation:hover{color:var(--ngs-filter-builder-condition-operation-hover-color);background:var(--ngs-filter-builder-condition-operation-hover-bg)}:host .condition-operation:active,:host .condition-operation.active{color:var(--ngs-filter-builder-condition-operation-active-color);background:var(--ngs-filter-builder-condition-operation-active-bg)}:host .condition-value{display:flex;align-items:center;width:max-content;-webkit-user-select:none;user-select:none;cursor:pointer;height:var(--ngs-filter-builder-condition-value-height);font-size:var(--ngs-filter-builder-condition-value-font-size);font-weight:var(--ngs-filter-builder-condition-value-font-weight);color:var(--ngs-filter-builder-condition-value-color);background:var(--ngs-filter-builder-condition-value-bg);border-radius:var(--ngs-filter-builder-condition-value-border-radius);padding:var(--ngs-filter-builder-condition-value-bpadding)}:host .condition-value:hover{color:var(--ngs-filter-builder-condition-value-hover-color);background:var(--ngs-filter-builder-condition-value-hover-bg)}:host-context(html.dark){--ngs-filter-builder-group-operation-color: var(--color-neutral-200);--ngs-filter-builder-group-operation-hover-bg: var(--color-neutral-600);--ngs-filter-builder-group-operation-active-bg: var(--color-neutral-650);--ngs-filter-builder-group-operation-hover-color: var(--color-neutral-100);--ngs-filter-builder-group-operation-active-color: var(--color-neutral-50)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
326
339
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], fieldDefs: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldDefs", required: false }] }], categories: [{ type: i0.Input, args: [{ isSignal: true, alias: "categories", required: false }] }], groupOperations: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupOperations", required: false }] }], customOperations: [{ type: i0.Input, args: [{ isSignal: true, alias: "customOperations", required: false }] }], _prebuiltOperationDefs: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => FilterBuilderOperationDefDirective), { isSignal: true }] }], _customOperationDefs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FilterBuilderOperationDefDirective), { isSignal: true }] }], valueChanged: [{ type: i0.Output, args: ["valueChanged"] }] } });
|
|
327
340
|
|
|
328
341
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngstarter-ui-components-filter-builder.mjs","sources":["../../../projects/components/filter-builder/src/filter-builder-operation-name.directive.ts","../../../projects/components/filter-builder/src/filter-builder-operation-icon.directive.ts","../../../projects/components/filter-builder/src/filter-builder-operation-def.directive.ts","../../../projects/components/filter-builder/src/filter-builder/filter-builder.ts","../../../projects/components/filter-builder/src/filter-builder/filter-builder.html","../../../projects/components/filter-builder/ngstarter-ui-components-filter-builder.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsFilterBuilderOperationName]',\n standalone: true\n})\nexport class FilterBuilderOperationNameDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsFilterBuilderOperationIcon]',\n standalone: true\n})\nexport class FilterBuilderOperationIconDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, contentChild, input } from '@angular/core';\nimport { FilterBuilderOperationNameDirective } from './filter-builder-operation-name.directive';\nimport { FilterBuilderOperationIconDirective } from './filter-builder-operation-icon.directive';\n\n@Directive({\n selector: '[ngsFilterBuilderOperationDef]',\n standalone: true\n})\nexport class FilterBuilderOperationDefDirective {\n id = input('', {\n alias: 'ngsFilterBuilderOperationDef'\n });\n allowedDataTypes = input<string[]>([]);\n readonly operationName = contentChild(FilterBuilderOperationNameDirective);\n readonly operationIcon = contentChild(FilterBuilderOperationIconDirective);\n}\n","import {\n AfterViewInit,\n ChangeDetectorRef,\n Component,\n inject,\n OnInit,\n output,\n PLATFORM_ID,\n viewChildren,\n contentChildren, TemplateRef, input\n} from '@angular/core';\nimport { CommonModule, isPlatformServer, NgTemplateOutlet } from '@angular/common';\nimport { FilterBuilderOperationDefDirective } from '../filter-builder-operation-def.directive';\nimport {\n FilterBuilderCondition,\n FilterBuilderFieldDataSourceItem,\n FilterBuilderFieldDef,\n FilterBuilderGroup,\n FilterBuilderItemType\n} from '../types';\nimport { Icon } from '@ngstarter-ui/components/icon';\nimport { MenuTrigger, Menu, MenuItem, MenuContent, MenuOptionGroupDirective } from '@ngstarter-ui/components/menu';\nimport { FormsModule } from '@angular/forms';\nimport { Select, Option } from '@ngstarter-ui/components/select';\nimport { FilterBuilderOperationNameDirective } from '../filter-builder-operation-name.directive';\nimport { AutoFocusDirective, FocusElementDirective } from '@ngstarter-ui/components/core';\nimport { Input } from '@ngstarter-ui/components/input';\nimport { FormField } from '@ngstarter-ui/components/form-field';\n\n@Component({\n selector: 'ngs-filter-builder',\n exportAs: 'ngsFilterBuilder',\n imports: [\n CommonModule,\n Icon,\n MenuTrigger,\n Menu,\n MenuContent,\n MenuOptionGroupDirective,\n FormsModule,\n MenuItem,\n FormField,\n Select,\n Option,\n AutoFocusDirective,\n FocusElementDirective,\n Input,\n FilterBuilderOperationDefDirective,\n FilterBuilderOperationNameDirective\n ],\n templateUrl: './filter-builder.html',\n styleUrl: './filter-builder.scss',\n host: {\n 'class': 'ngs-filter-builder'\n },\n})\nexport class FilterBuilder implements OnInit, AfterViewInit {\n protected _cdr = inject(ChangeDetectorRef);\n protected _isServer = isPlatformServer(inject(PLATFORM_ID));\n protected _operationAllowedTypesMap: Map<string, string[]> = new Map();\n private _resetMethodMap: { [prop: string]: (condition: FilterBuilderCondition) => void } = {\n '_resetStringValue': this._resetStringValue,\n '_resetBooleanValue': this._resetBooleanValue,\n '_resetArrayValue': this._resetArrayValue,\n '_resetNumberValue': this._resetNumberValue,\n };\n\n value = input<FilterBuilderGroup[]>([]);\n fieldDefs = input<FilterBuilderFieldDef[]>([]);\n categories = input([]);\n groupOperations = input([\n {\n id: 'and',\n name: 'And'\n },\n {\n id: 'or',\n name: 'Or'\n }\n ]);\n customOperations = input([]);\n\n protected _logicalOperator = this.groupOperations()[0].id;\n readonly _prebuiltOperationDefs = viewChildren(FilterBuilderOperationDefDirective);\n readonly _customOperationDefs = contentChildren(FilterBuilderOperationDefDirective);\n protected _operationDefs: FilterBuilderOperationDefDirective[] = [];\n\n readonly valueChanged = output<FilterBuilderGroup[]>();\n\n protected _value: FilterBuilderGroup[] = [];\n protected _operations: any[] = [];\n protected editItem: FilterBuilderCondition | undefined;\n\n ngOnInit() {\n if (this.value().length) {\n if (!this._isGroup(this.value()[0])) {\n throw new Error('Invalid filter value, first element should be a filter group');\n }\n\n this._logicalOperator = this.value()[0]['logicalOperator'] as string;\n this._value = JSON.parse(JSON.stringify(this.value()[0]['value']));\n }\n }\n\n ngAfterViewInit(): void {\n this._operationDefs = [...this._prebuiltOperationDefs(), ...this._customOperationDefs()];\n this._operationDefs.forEach(operationDef => {\n this._operations.push({\n id: operationDef.id(),\n name: operationDef.operationName()?.templateRef\n });\n operationDef.allowedDataTypes().forEach((allowedType: string) => {\n if (!this._operationAllowedTypesMap.has(allowedType)) {\n this._operationAllowedTypesMap.set(allowedType, []);\n }\n\n const allowedTypeValue = this._operationAllowedTypesMap.get(allowedType) as string[];\n allowedTypeValue.push(operationDef.id());\n this._operationAllowedTypesMap.set(allowedType, allowedTypeValue);\n });\n });\n this._cdr.detectChanges();\n }\n\n addCondition(targetGroup?: FilterBuilderGroup) {\n const value = !targetGroup ? this._value : targetGroup.value;\n value.push(\n {\n value: [this.fieldDefs()[0].dataField, this._operations[0].id, '']\n }\n );\n }\n\n addGroup(targetGroup?: FilterBuilderGroup) {\n const value = !targetGroup ? this._value : targetGroup.value;\n value.push(\n {\n logicalOperator: this.groupOperations()[0].id,\n value: []\n }\n );\n }\n\n getConditionField(dataField: string): FilterBuilderFieldDef | undefined {\n return this.fieldDefs().find(field => field.dataField === dataField);\n }\n\n getConditionOperation(id: string) {\n return this._operations.find(operation => operation.id === id);\n }\n\n getSelectedGroupOperationName(targetGroup?: FilterBuilderGroup): string {\n const groupLogicalOperatorId = targetGroup ? targetGroup.logicalOperator : this._logicalOperator\n return this.groupOperations().find(groupOperator => groupOperator.id === groupLogicalOperatorId)?.name || '';\n }\n\n selectConditionField(item: FilterBuilderCondition, field: FilterBuilderFieldDef): void {\n this.editItem = undefined;\n let allowedTypes = this._operationAllowedTypesMap.get(field.dataType) as string[];\n item['value'][1] = allowedTypes[0];\n this._resetValue(field, item);\n this._emitChangeEvent();\n }\n\n operationChanged(item: FilterBuilderCondition, operation: string): void {\n this.editItem = undefined;\n const oldOperation = item['value'][1];\n\n if (oldOperation === 'equals' && operation === 'isAnyOf') {\n item['value'][2] = [];\n } else if (oldOperation === 'isAnyOf' && operation === 'equals') {\n item['value'][2] = null;\n }\n\n if (oldOperation === 'isBetween' && operation !== 'isBetween') {\n item['value'][2] = null;\n } else if (oldOperation !== 'isBetween' && operation === 'isBetween') {\n item['value'][2] = [];\n }\n\n if (['isNotBlank', 'isBlank'].includes(operation)) {\n item['value'][2] = null;\n }\n\n item['value'][1] = operation;\n this._emitChangeEvent();\n }\n\n removeCondition(index: number, items: FilterBuilderItemType[]): void {\n items.splice(index, 1);\n this._emitChangeEvent();\n }\n\n isOperationAllowedForCondition(dataField: string, operationId: string): boolean {\n const fieldDef = this.fieldDefs().find(f =>\n f.dataField === dataField\n ) as FilterBuilderFieldDef;\n\n let allowedTypes = this._operationAllowedTypesMap.get(fieldDef.dataType);\n\n if (!allowedTypes) {\n throw new Error('There are not operations for the datatype: ' + fieldDef.dataType);\n }\n\n return allowedTypes.includes(operationId);\n }\n\n modifyValue(item: FilterBuilderCondition): void {\n this.editItem = item;\n }\n\n getFieldType(item: FilterBuilderCondition): string {\n return (this.fieldDefs().find(f =>\n f.dataField === item['value'][0]\n ) as FilterBuilderFieldDef).dataType;\n }\n\n isValueNotEmpty(item: FilterBuilderCondition): boolean {\n if (this.getFieldType(item) === 'array') {\n if (item['value'][1] === 'equals') {\n return item['value'][2] !== null && item['value'][2] !== '';\n } else {\n return item['value'][2].length > 0;\n }\n }\n\n if (item['value'][1] === 'isBetween') {\n return item['value'][2].length === 2 && item['value'][2][0] !== null && item['value'][2][1] !== null;\n }\n\n return item['value'][2] !== null && item['value'][2] !== '';\n }\n\n cancelEdit(delay = 0): void {\n setTimeout(() => {\n this.editItem = undefined;\n this._cdr.detectChanges();\n }, delay);\n }\n\n getOptions(item: FilterBuilderCondition): FilterBuilderFieldDataSourceItem[] {\n const fieldDef = this._getFieldDef(item);\n return fieldDef.lookup?.dataSource as FilterBuilderFieldDataSourceItem[];\n }\n\n getDataSourceItemNameById(item: FilterBuilderCondition, dataSourceItemId: string): string {\n const fieldDef = this._getFieldDef(item);\n return (fieldDef.lookup?.dataSource as FilterBuilderFieldDataSourceItem[]).find(\n item => item.id === dataSourceItemId\n )?.name || '';\n }\n\n selectBlur(event: FocusEvent): void {\n event.preventDefault();\n event.stopPropagation();\n const select = event.target as HTMLElement;\n\n setTimeout(() => {\n const formField = select.closest('.ngs-form-field');\n\n if (formField) {\n this.cancelEdit();\n }\n }, 200);\n }\n\n selectClosed(): void {\n this.cancelEdit();\n this._emitChangeEvent();\n }\n\n protected operationIconTemplateRef(operation: FilterBuilderOperationDefDirective): TemplateRef<any> {\n return operation.operationIcon()?.templateRef as TemplateRef<any>;\n }\n\n protected operationNameTemplateRef(operation: FilterBuilderOperationDefDirective): TemplateRef<any> {\n return operation.operationName()?.templateRef as TemplateRef<any>;\n }\n\n protected _isGroup(item: FilterBuilderItemType): item is FilterBuilderGroup {\n return 'logicalOperator' in item;\n }\n\n protected _isCondition(item: FilterBuilderItemType): item is FilterBuilderCondition {\n return !('logicalOperator' in item);\n }\n\n protected _emitChangeEvent(): void {\n const value = this._normalizeValue(this._value);\n\n if (value.length > 0) {\n this.valueChanged.emit([\n {\n logicalOperator: this._logicalOperator,\n value: value\n }\n ]);\n } else {\n this.valueChanged.emit([]);\n }\n }\n\n private _getFieldDef(condition: FilterBuilderCondition): FilterBuilderFieldDef {\n return this.fieldDefs().find(f =>\n f.dataField === condition['value'][0]\n ) as FilterBuilderFieldDef;\n }\n\n private _resetValue(field: FilterBuilderFieldDef, condition: FilterBuilderCondition): void {\n const fieldDef = this.fieldDefs().find(f =>\n f.dataField === field.dataField\n ) as FilterBuilderFieldDef;\n const resetMethod = '_reset' + this._capitalizeFirstLetter(fieldDef.dataType) + 'Value';\n this._resetMethodMap[resetMethod](condition);\n }\n\n private _resetStringValue(condition: FilterBuilderCondition): void {\n condition['value'][2] = '';\n }\n\n private _resetNumberValue(condition: FilterBuilderCondition): void {\n condition['value'][2] = null;\n }\n\n private _resetArrayValue(condition: FilterBuilderCondition): void {\n if (condition['value'][1] === 'equals') {\n condition['value'][2] = null;\n } else {\n condition['value'][2] = [];\n }\n }\n\n private _resetBooleanValue(condition: FilterBuilderCondition): void {\n condition['value'][2] = false;\n }\n\n private _capitalizeFirstLetter(value: string) {\n return value.charAt(0).toUpperCase() + value.slice(1);\n }\n\n private _normalizeValue(value: FilterBuilderItemType[]): FilterBuilderItemType[] {\n let result: FilterBuilderItemType[] = [];\n value.forEach(item => {\n if (this._isGroup(item)) {\n const groupValue = this._normalizeValue(item.value);\n\n if (groupValue.length > 0) {\n result = [...result, {\n logicalOperator: item.logicalOperator,\n value: groupValue\n }];\n }\n } else {\n if (this.isValueNotEmpty(item)) {\n result.push(item);\n }\n }\n });\n return result;\n }\n}\n","@if (_isServer) {\n <ng-content/>\n}\n\n<ng-template #itemsTpl let-items>\n <div class=\"group\">\n @for (item of items; track item; let index = $index) {\n @if (_isGroup(item)) {\n <div class=\"flex items-center group-operations\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button [ngsMenuTriggerFor]=\"nestedGroupOperationsMenu\" class=\"group-operation\">\n {{ getSelectedGroupOperationName(item) }}\n </button>\n <div [ngsMenuTriggerFor]=\"addGroupMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n <ngs-menu #nestedGroupOperationsMenu=\"ngsMenu\">\n <div ngsMenuOptionGroup [(ngModel)]=\"item['logicalOperator']\">\n @for (groupOperation of groupOperations(); track groupOperation.id) {\n <ngs-option [value]=\"groupOperation.id\">{{ groupOperation.name }}</ngs-option>\n }\n </div>\n </ngs-menu>\n <ngs-menu #addGroupMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"addCondition(item)\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup(item)\">Add Group</button>\n </ngs-menu>\n </div>\n @if (item['value'].length > 0) {\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: item['value'] }\" />\n }\n } @else if (_isCondition(item)) {\n <div class=\"condition\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button class=\"condition-field\"\n [ngsMenuTriggerFor]=\"fieldsMenu\">{{ getConditionField(item['value'][0])?.name }}</button>\n <button class=\"condition-operation\"\n [ngsMenuTriggerFor]=\"operationsMenu\">\n <ng-template [ngTemplateOutlet]=\"getConditionOperation(item['value'][1])?.name\" />\n </button>\n <div class=\"relative\">\n @if (editItem && editItem === item) {\n <div class=\"absolute start-0 top-0 -translate-y-1/2\">\n @switch (getFieldType(editItem)) {\n @case ('array') {\n @switch (editItem['value'][1]) {\n @case ('equals') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\"\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n\n @case ('isAnyOf') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\" multiple\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (closed)=\"selectClosed()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n }\n }\n\n @case ('number') {\n @switch (editItem['value'][1]) {\n @case ('isBetween') {\n <div class=\"flex gap-2 items-center\"\n ngsFocusElement (elementBlurred)=\"cancelEdit()\">\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n [(ngModel)]=\"item['value'][2][0]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n <div class=\"text-neutral-500\">–</div>\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput\n [(ngModel)]=\"item['value'][2][1]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n </div>\n }\n @default {\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n }\n\n @default {\n <ngs-form-field class=\"form-field\">\n <input type=\"text\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n </div>\n } @else {\n @if (item['value'][1] !== 'isBlank' && item['value'][1] !== 'isNotBlank') {\n @if (isValueNotEmpty(item)) {\n @if (getFieldType(item) === 'array') {\n @if (item['value'][1] === 'equals') {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n {{ getDataSourceItemNameById(item, item['value'][2]) }}\n </button>\n } @else {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n @for (dataSourceItemId of item['value'][2]; track dataSourceItemId; let last = $last) {\n <span>{{ getDataSourceItemNameById(item, dataSourceItemId) }}</span>\n @if (!last) {\n <span class=\"text-neutral-500\">|</span>\n }\n }\n </button>\n }\n } @else {\n @if (item['value'][1] === 'isBetween') {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2][0] }}</span>\n <span class=\"text-neutral-500\">–</span>\n <span>{{ item['value'][2][1] }}</span>\n </button>\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2] }}</span>\n </button>\n }\n }\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span i18n><enter a value></span>\n </button>\n }\n }\n }\n </div>\n </div>\n <ngs-menu #fieldsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"item['value'][0]\">\n @for (fieldDef of fieldDefs(); track fieldDef) {\n <ngs-option [value]=\"fieldDef.dataField\"\n (click)=\"selectConditionField(item, fieldDef)\">{{ fieldDef.name }}</ngs-option>\n }\n </div>\n </ng-template>\n </ngs-menu>\n <ngs-menu #operationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][1]\">\n @for (operation of _operationDefs; track operation.id()) {\n <div [hidden]=\"!isOperationAllowedForCondition(item['value'][0], operation.id())\">\n <ngs-option [value]=\"operation.id()\" (click)=\"operationChanged(item, operation.id())\">\n <div class=\"flex items-center gap-3\">\n @if (operation.operationIcon()) {\n <ng-template [ngTemplateOutlet]=\"operationIconTemplateRef(operation)\" />\n }\n <div>\n <ng-template [ngTemplateOutlet]=\"operationNameTemplateRef(operation)\" />\n </div>\n </div>\n </ngs-option>\n </div>\n }\n </div>\n </ng-template>\n </ngs-menu>\n }\n }\n </div>\n</ng-template>\n\n<div class=\"group\">\n <div class=\"flex items-center group-operations\">\n <button [ngsMenuTriggerFor]=\"groupOperationsMenu\" class=\"group-operation\">\n {{ getSelectedGroupOperationName() }}\n </button>\n <div [ngsMenuTriggerFor]=\"addMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n </div>\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: _value }\" />\n</div>\n\n<ngs-menu #groupOperationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"_logicalOperator\" (ngModelChange)=\"_emitChangeEvent()\">\n @for (operation of groupOperations(); track operation.id) {\n <ngs-option [value]=\"operation.id\">{{ operation.name }}</ngs-option>\n }\n </div>\n </ng-template>\n</ngs-menu>\n<ngs-menu #addMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <button ngs-menu-item (click)=\"addCondition()\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup()\">Add Group</button>\n </ng-template>\n</ngs-menu>\n\n<ng-container ngsFilterBuilderOperationDef=\"contains\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Contains</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"doesNotContain\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Does not contain</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"startsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Starts with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"endsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Ends with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"equals\" [allowedDataTypes]=\"['string', 'number', 'array', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"notEquals\" [allowedDataTypes]=\"['string', 'number', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Not equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isNotBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is not blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBetween\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is between</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isAnyOf\" [allowedDataTypes]=\"['array']\">\n <ng-template ngsFilterBuilderOperationName>Is any of</ng-template>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngstarter-ui-components-filter-builder.mjs","sources":["../../../projects/components/filter-builder/src/filter-builder-operation-name.directive.ts","../../../projects/components/filter-builder/src/filter-builder-operation-icon.directive.ts","../../../projects/components/filter-builder/src/filter-builder-operation-def.directive.ts","../../../projects/components/filter-builder/src/filter-builder/filter-builder.ts","../../../projects/components/filter-builder/src/filter-builder/filter-builder.html","../../../projects/components/filter-builder/ngstarter-ui-components-filter-builder.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsFilterBuilderOperationName]',\n standalone: true\n})\nexport class FilterBuilderOperationNameDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsFilterBuilderOperationIcon]',\n standalone: true\n})\nexport class FilterBuilderOperationIconDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, contentChild, input } from '@angular/core';\nimport { FilterBuilderOperationNameDirective } from './filter-builder-operation-name.directive';\nimport { FilterBuilderOperationIconDirective } from './filter-builder-operation-icon.directive';\n\n@Directive({\n selector: '[ngsFilterBuilderOperationDef]',\n standalone: true\n})\nexport class FilterBuilderOperationDefDirective {\n id = input('', {\n alias: 'ngsFilterBuilderOperationDef'\n });\n allowedDataTypes = input<string[]>([]);\n readonly operationName = contentChild(FilterBuilderOperationNameDirective);\n readonly operationIcon = contentChild(FilterBuilderOperationIconDirective);\n}\n","import {\n AfterViewInit,\n ChangeDetectorRef,\n Component,\n inject,\n OnInit,\n output,\n PLATFORM_ID,\n viewChildren,\n contentChildren, TemplateRef, input\n} from '@angular/core';\nimport { CommonModule, isPlatformServer, NgTemplateOutlet } from '@angular/common';\nimport { FilterBuilderOperationDefDirective } from '../filter-builder-operation-def.directive';\nimport {\n FilterBuilderCondition,\n FilterBuilderFieldDataSourceItem,\n FilterBuilderFieldDef,\n FilterBuilderGroup,\n FilterBuilderItemType\n} from '../types';\nimport { Icon } from '@ngstarter-ui/components/icon';\nimport { MenuTrigger, Menu, MenuItem, MenuContent, MenuOptionGroupDirective } from '@ngstarter-ui/components/menu';\nimport { FormsModule } from '@angular/forms';\nimport { Select, Option } from '@ngstarter-ui/components/select';\nimport { FilterBuilderOperationNameDirective } from '../filter-builder-operation-name.directive';\nimport { AutoFocusDirective, FocusElementDirective } from '@ngstarter-ui/components/core';\nimport { Input } from '@ngstarter-ui/components/input';\nimport { FormField } from '@ngstarter-ui/components/form-field';\n\n@Component({\n selector: 'ngs-filter-builder',\n exportAs: 'ngsFilterBuilder',\n imports: [\n CommonModule,\n Icon,\n MenuTrigger,\n Menu,\n MenuContent,\n MenuOptionGroupDirective,\n FormsModule,\n MenuItem,\n FormField,\n Select,\n Option,\n AutoFocusDirective,\n FocusElementDirective,\n Input,\n FilterBuilderOperationDefDirective,\n FilterBuilderOperationNameDirective\n ],\n templateUrl: './filter-builder.html',\n styleUrl: './filter-builder.scss',\n host: {\n 'class': 'ngs-filter-builder'\n },\n})\nexport class FilterBuilder implements OnInit, AfterViewInit {\n protected _cdr = inject(ChangeDetectorRef);\n protected _isServer = isPlatformServer(inject(PLATFORM_ID));\n protected _operationAllowedTypesMap: Map<string, string[]> = new Map();\n private _resetMethodMap: { [prop: string]: (condition: FilterBuilderCondition) => void } = {\n '_resetStringValue': this._resetStringValue,\n '_resetBooleanValue': this._resetBooleanValue,\n '_resetArrayValue': this._resetArrayValue,\n '_resetNumberValue': this._resetNumberValue,\n };\n\n value = input<FilterBuilderGroup[]>([]);\n fieldDefs = input<FilterBuilderFieldDef[]>([]);\n categories = input([]);\n groupOperations = input([\n {\n id: 'and',\n name: 'And'\n },\n {\n id: 'or',\n name: 'Or'\n }\n ]);\n customOperations = input([]);\n\n protected _logicalOperator = this.groupOperations()[0].id;\n readonly _prebuiltOperationDefs = viewChildren(FilterBuilderOperationDefDirective);\n readonly _customOperationDefs = contentChildren(FilterBuilderOperationDefDirective);\n protected _operationDefs: FilterBuilderOperationDefDirective[] = [];\n\n readonly valueChanged = output<FilterBuilderGroup[]>();\n\n protected _value: FilterBuilderGroup[] = [];\n protected _operations: any[] = [];\n protected editItem: FilterBuilderCondition | undefined;\n protected _tempMultipleValue: any[] = [];\n\n ngOnInit() {\n if (this.value().length) {\n if (!this._isGroup(this.value()[0])) {\n throw new Error('Invalid filter value, first element should be a filter group');\n }\n\n this._logicalOperator = this.value()[0]['logicalOperator'] as string;\n this._value = JSON.parse(JSON.stringify(this.value()[0]['value']));\n }\n }\n\n ngAfterViewInit(): void {\n this._operationDefs = [...this._prebuiltOperationDefs(), ...this._customOperationDefs()];\n this._operationDefs.forEach(operationDef => {\n this._operations.push({\n id: operationDef.id(),\n name: operationDef.operationName()?.templateRef\n });\n operationDef.allowedDataTypes().forEach((allowedType: string) => {\n if (!this._operationAllowedTypesMap.has(allowedType)) {\n this._operationAllowedTypesMap.set(allowedType, []);\n }\n\n const allowedTypeValue = this._operationAllowedTypesMap.get(allowedType) as string[];\n allowedTypeValue.push(operationDef.id());\n this._operationAllowedTypesMap.set(allowedType, allowedTypeValue);\n });\n });\n this._cdr.detectChanges();\n }\n\n addCondition(targetGroup?: FilterBuilderGroup) {\n const value = !targetGroup ? this._value : targetGroup.value;\n value.push(\n {\n value: [this.fieldDefs()[0].dataField, this._operations[0].id, '']\n }\n );\n }\n\n addGroup(targetGroup?: FilterBuilderGroup) {\n const value = !targetGroup ? this._value : targetGroup.value;\n value.push(\n {\n logicalOperator: this.groupOperations()[0].id,\n value: []\n }\n );\n }\n\n getConditionField(dataField: string): FilterBuilderFieldDef | undefined {\n return this.fieldDefs().find(field => field.dataField === dataField);\n }\n\n getConditionOperation(id: string) {\n return this._operations.find(operation => operation.id === id);\n }\n\n getSelectedGroupOperationName(targetGroup?: FilterBuilderGroup): string {\n const groupLogicalOperatorId = targetGroup ? targetGroup.logicalOperator : this._logicalOperator\n return this.groupOperations().find(groupOperator => groupOperator.id === groupLogicalOperatorId)?.name || '';\n }\n\n selectConditionField(item: FilterBuilderCondition, field: FilterBuilderFieldDef): void {\n let allowedTypes = this._operationAllowedTypesMap.get(field.dataType) as string[];\n item['value'][0] = field.dataField;\n item['value'][1] = allowedTypes[0];\n this._resetValue(field, item);\n this.editItem = undefined;\n this._emitChangeEvent();\n }\n\n operationChanged(item: FilterBuilderCondition, operation: string): void {\n const oldOperation = item['value'][1];\n\n if (oldOperation === 'equals' && operation === 'isAnyOf') {\n item['value'][2] = [];\n } else if (oldOperation === 'isAnyOf' && operation === 'equals') {\n item['value'][2] = null;\n }\n\n if (oldOperation === 'isBetween' && operation !== 'isBetween') {\n item['value'][2] = null;\n } else if (oldOperation !== 'isBetween' && operation === 'isBetween') {\n item['value'][2] = [];\n }\n\n if (['isNotBlank', 'isBlank'].includes(operation)) {\n item['value'][2] = null;\n }\n\n item['value'][1] = operation;\n this.editItem = undefined;\n this._emitChangeEvent();\n }\n\n removeCondition(index: number, items: FilterBuilderItemType[]): void {\n items.splice(index, 1);\n this._emitChangeEvent();\n }\n\n isOperationAllowedForCondition(dataField: string, operationId: string): boolean {\n const fieldDef = this.fieldDefs().find(f =>\n f.dataField === dataField\n ) as FilterBuilderFieldDef;\n\n let allowedTypes = this._operationAllowedTypesMap.get(fieldDef.dataType);\n\n if (!allowedTypes) {\n throw new Error('There are not operations for the datatype: ' + fieldDef.dataType);\n }\n\n return allowedTypes.includes(operationId);\n }\n\n modifyValue(item: FilterBuilderCondition): void {\n this.editItem = item;\n if (this.getFieldType(item) === 'array' && item['value'][1] === 'isAnyOf') {\n this._tempMultipleValue = [...(item['value'][2] || [])];\n }\n }\n\n getFieldType(item: FilterBuilderCondition): string {\n return (this.fieldDefs().find(f =>\n f.dataField === item['value'][0]\n ) as FilterBuilderFieldDef).dataType;\n }\n\n isValueNotEmpty(item: FilterBuilderCondition): boolean {\n if (this.getFieldType(item) === 'array') {\n if (item['value'][1] === 'equals') {\n return item['value'][2] !== null && item['value'][2] !== '';\n } else {\n return item['value'][2].length > 0;\n }\n }\n\n if (item['value'][1] === 'isBetween') {\n return item['value'][2].length === 2 && item['value'][2][0] !== null && item['value'][2][1] !== null;\n }\n\n return item['value'][2] !== null && item['value'][2] !== '';\n }\n\n cancelEdit(delay = 0): void {\n setTimeout(() => {\n this.editItem = undefined;\n this._cdr.detectChanges();\n }, delay);\n }\n\n getOptions(item: FilterBuilderCondition): FilterBuilderFieldDataSourceItem[] {\n const fieldDef = this._getFieldDef(item);\n return fieldDef.lookup?.dataSource as FilterBuilderFieldDataSourceItem[];\n }\n\n getDataSourceItemNameById(item: FilterBuilderCondition, dataSourceItemId: string): string {\n const fieldDef = this._getFieldDef(item);\n return (fieldDef.lookup?.dataSource as FilterBuilderFieldDataSourceItem[]).find(\n item => item.id === dataSourceItemId\n )?.name || '';\n }\n\n selectBlur(event: FocusEvent): void {\n if (this.editItem && this.getFieldType(this.editItem) === 'array' && this.editItem['value'][1] === 'isAnyOf') {\n return;\n }\n event.preventDefault();\n event.stopPropagation();\n const select = event.target as HTMLElement;\n\n setTimeout(() => {\n const formField = select.closest('.ngs-form-field');\n\n if (formField) {\n this.cancelEdit();\n }\n }, 200);\n }\n\n selectClosed(): void {\n if (this.editItem && this.getFieldType(this.editItem) === 'array' && this.editItem['value'][1] === 'isAnyOf') {\n this.editItem['value'][2] = [...this._tempMultipleValue];\n }\n this.cancelEdit();\n setTimeout(() => {\n this._emitChangeEvent();\n });\n }\n\n protected operationIconTemplateRef(operation: FilterBuilderOperationDefDirective): TemplateRef<any> {\n return operation.operationIcon()?.templateRef as TemplateRef<any>;\n }\n\n protected operationNameTemplateRef(operation: FilterBuilderOperationDefDirective): TemplateRef<any> {\n return operation.operationName()?.templateRef as TemplateRef<any>;\n }\n\n protected _isGroup(item: FilterBuilderItemType): item is FilterBuilderGroup {\n return 'logicalOperator' in item;\n }\n\n protected _isCondition(item: FilterBuilderItemType): item is FilterBuilderCondition {\n return !('logicalOperator' in item);\n }\n\n protected _emitChangeEvent(): void {\n const value = this._normalizeValue(this._value);\n\n if (value.length > 0) {\n this.valueChanged.emit([\n {\n logicalOperator: this._logicalOperator,\n value: value\n }\n ]);\n } else {\n this.valueChanged.emit([]);\n }\n }\n\n private _getFieldDef(condition: FilterBuilderCondition): FilterBuilderFieldDef {\n return this.fieldDefs().find(f =>\n f.dataField === condition['value'][0]\n ) as FilterBuilderFieldDef;\n }\n\n private _resetValue(field: FilterBuilderFieldDef, condition: FilterBuilderCondition): void {\n const fieldDef = this.fieldDefs().find(f =>\n f.dataField === field.dataField\n ) as FilterBuilderFieldDef;\n const resetMethod = '_reset' + this._capitalizeFirstLetter(fieldDef.dataType) + 'Value';\n this._resetMethodMap[resetMethod](condition);\n }\n\n private _resetStringValue(condition: FilterBuilderCondition): void {\n condition['value'][2] = '';\n }\n\n private _resetNumberValue(condition: FilterBuilderCondition): void {\n condition['value'][2] = null;\n }\n\n private _resetArrayValue(condition: FilterBuilderCondition): void {\n if (condition['value'][1] === 'equals') {\n condition['value'][2] = null;\n } else {\n condition['value'][2] = [];\n }\n }\n\n private _resetBooleanValue(condition: FilterBuilderCondition): void {\n condition['value'][2] = false;\n }\n\n private _capitalizeFirstLetter(value: string) {\n return value.charAt(0).toUpperCase() + value.slice(1);\n }\n\n private _normalizeValue(value: FilterBuilderItemType[]): FilterBuilderItemType[] {\n let result: FilterBuilderItemType[] = [];\n value.forEach(item => {\n if (this._isGroup(item)) {\n const groupValue = this._normalizeValue(item.value);\n\n if (groupValue.length > 0) {\n result = [...result, {\n logicalOperator: item.logicalOperator,\n value: groupValue\n }];\n }\n } else {\n if (this.isValueNotEmpty(item)) {\n result.push(item);\n }\n }\n });\n return result;\n }\n}\n","@if (_isServer) {\n <ng-content/>\n}\n\n<ng-template #itemsTpl let-items>\n <div class=\"group\">\n @for (item of items; track item; let index = $index) {\n @if (_isGroup(item)) {\n <div class=\"flex items-center group-operations\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button [ngsMenuTriggerFor]=\"nestedGroupOperationsMenu\"\n #nestedGroupOperationsMenuTrigger=\"ngsMenuTrigger\"\n class=\"group-operation\">\n {{ getSelectedGroupOperationName(item) }}\n </button>\n <div [ngsMenuTriggerFor]=\"addGroupMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n <ngs-menu #nestedGroupOperationsMenu=\"ngsMenu\">\n <div ngsMenuOptionGroup [(ngModel)]=\"item['logicalOperator']\">\n @for (groupOperation of groupOperations(); track groupOperation.id) {\n <ngs-option [value]=\"groupOperation.id\"\n (click)=\"nestedGroupOperationsMenuTrigger.closeMenu('click')\">{{ groupOperation.name }}\n </ngs-option>\n }\n </div>\n </ngs-menu>\n <ngs-menu #addGroupMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"addCondition(item)\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup(item)\">Add Group</button>\n </ngs-menu>\n </div>\n @if (item['value'].length > 0) {\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: item['value'] }\"/>\n }\n } @else if (_isCondition(item)) {\n <div class=\"condition\">\n <div class=\"remove\" (click)=\"removeCondition(index, items)\">\n <ngs-icon name=\"fluent:dismiss-24-regular\" class=\"font-icon\"/>\n </div>\n <button class=\"condition-field\"\n #fieldsMenuTrigger=\"ngsMenuTrigger\"\n [ngsMenuTriggerFor]=\"fieldsMenu\">{{ getConditionField(item['value'][0])?.name }}\n </button>\n <button class=\"condition-operation\"\n #operationsMenuTrigger=\"ngsMenuTrigger\"\n [ngsMenuTriggerFor]=\"operationsMenu\">\n <ng-template [ngTemplateOutlet]=\"getConditionOperation(item['value'][1])?.name\"/>\n </button>\n <div class=\"relative\">\n @if (editItem && editItem === item) {\n <div class=\"absolute start-0 top-0 -translate-y-1/2\">\n @switch (getFieldType(editItem)) {\n @case ('array') {\n @switch (editItem['value'][1]) {\n @case ('equals') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\"\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n @case ('isAnyOf') {\n <ngs-form-field class=\"form-field\">\n <ngs-select placeholder=\"Select...\" multiple\n ngsAutoFocus\n (blur)=\"selectBlur($event)\"\n [(ngModel)]=\"_tempMultipleValue\"\n (closed)=\"selectClosed()\">\n @for (option of getOptions(editItem); track option.id) {\n <ngs-option [value]=\"option.id\">{{ option.name }}</ngs-option>\n }\n </ngs-select>\n </ngs-form-field>\n }\n }\n }\n @case ('number') {\n @switch (editItem['value'][1]) {\n @case ('isBetween') {\n <div class=\"flex gap-2 items-center\"\n ngsFocusElement (elementBlurred)=\"cancelEdit()\">\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n [(ngModel)]=\"item['value'][2][0]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n <div class=\"text-neutral-500\">–</div>\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput\n [(ngModel)]=\"item['value'][2][1]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n </div>\n }\n @default {\n <ngs-form-field class=\"form-field-number\">\n <input type=\"number\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n }\n @default {\n <ngs-form-field class=\"form-field\">\n <input type=\"text\" ngsInput ngsAutoFocus\n (blur)=\"cancelEdit()\"\n [(ngModel)]=\"item['value'][2]\"\n (ngModelChange)=\"_emitChangeEvent()\">\n </ngs-form-field>\n }\n }\n </div>\n } @else {\n @if (item['value'][1] !== 'isBlank' && item['value'][1] !== 'isNotBlank') {\n @if (isValueNotEmpty(item)) {\n @if (getFieldType(item) === 'array') {\n @if (item['value'][1] === 'equals') {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n {{ getDataSourceItemNameById(item, item['value'][2]) }}\n </button>\n } @else {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n @for (dataSourceItemId of item['value'][2]; track dataSourceItemId; let last = $last) {\n <span>{{ getDataSourceItemNameById(item, dataSourceItemId) }}</span>\n @if (!last) {\n <span class=\"text-neutral-500\">|</span>\n }\n }\n </button>\n }\n } @else {\n @if (item['value'][1] === 'isBetween') {\n <button class=\"condition-value flex items-center gap-2\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2][0] }}</span>\n <span class=\"text-neutral-500\">–</span>\n <span>{{ item['value'][2][1] }}</span>\n </button>\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span>{{ item['value'][2] }}</span>\n </button>\n }\n }\n } @else {\n <button class=\"condition-value\" (click)=\"modifyValue(item)\">\n <span i18n><enter a value></span>\n </button>\n }\n }\n }\n </div>\n </div>\n <ngs-menu #fieldsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][0]\">\n @for (fieldDef of fieldDefs(); track fieldDef) {\n <ngs-option [value]=\"fieldDef.dataField\"\n (click)=\"selectConditionField(item, fieldDef); fieldsMenuTrigger.closeMenu('click')\">{{ fieldDef.name }}\n </ngs-option>\n }\n </div>\n </ng-template>\n </ngs-menu>\n <ngs-menu #operationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [ngModel]=\"item['value'][1]\">\n @for (operation of _operationDefs; track operation.id()) {\n <div [hidden]=\"!isOperationAllowedForCondition(item['value'][0], operation.id())\">\n <ngs-option [value]=\"operation.id()\"\n (click)=\"operationChanged(item, operation.id()); operationsMenuTrigger.closeMenu('click')\">\n <div class=\"flex items-center gap-3\">\n @if (operation.operationIcon()) {\n <ng-template [ngTemplateOutlet]=\"operationIconTemplateRef(operation)\"/>\n }\n <div>\n <ng-template [ngTemplateOutlet]=\"operationNameTemplateRef(operation)\"/>\n </div>\n </div>\n </ngs-option>\n </div>\n }\n </div>\n </ng-template>\n </ngs-menu>\n }\n }\n </div>\n</ng-template>\n\n<div class=\"group\">\n <div class=\"flex items-center group-operations\">\n <button [ngsMenuTriggerFor]=\"groupOperationsMenu\"\n #groupOperationsMenuTrigger=\"ngsMenuTrigger\"\n class=\"group-operation\">\n {{ getSelectedGroupOperationName() }}\n </button>\n <div [ngsMenuTriggerFor]=\"addMenu\" class=\"add\">\n <ngs-icon name=\"fluent:add-24-regular\" class=\"font-icon\"/>\n </div>\n </div>\n <ng-container [ngTemplateOutlet]=\"itemsTpl\" [ngTemplateOutletContext]=\"{ $implicit: _value }\"/>\n</div>\n\n<ngs-menu #groupOperationsMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <div ngsMenuOptionGroup [(ngModel)]=\"_logicalOperator\" (ngModelChange)=\"_emitChangeEvent()\">\n @for (operation of groupOperations(); track operation.id) {\n <ngs-option [value]=\"operation.id\"\n (click)=\"groupOperationsMenuTrigger.closeMenu('click')\">{{ operation.name }}\n </ngs-option>\n }\n </div>\n </ng-template>\n</ngs-menu>\n<ngs-menu #addMenu=\"ngsMenu\">\n <ng-template ngsMenuContent>\n <button ngs-menu-item (click)=\"addCondition()\">Add Condition</button>\n <button ngs-menu-item (click)=\"addGroup()\">Add Group</button>\n </ng-template>\n</ngs-menu>\n\n<ng-container ngsFilterBuilderOperationDef=\"contains\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Contains</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"doesNotContain\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Does not contain</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"startsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Starts with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"endsWith\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Ends with</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"equals\" [allowedDataTypes]=\"['string', 'number', 'array', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"notEquals\" [allowedDataTypes]=\"['string', 'number', 'boolean']\">\n <ng-template ngsFilterBuilderOperationName>Not equals</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isLessThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is less then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThen\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isGreaterThenOrEqual\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is greater then or equal to</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isNotBlank\" [allowedDataTypes]=\"['string']\">\n <ng-template ngsFilterBuilderOperationName>Is not blank</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isBetween\" [allowedDataTypes]=\"['number']\">\n <ng-template ngsFilterBuilderOperationName>Is between</ng-template>\n</ng-container>\n<ng-container ngsFilterBuilderOperationDef=\"isAnyOf\" [allowedDataTypes]=\"['array']\">\n <ng-template ngsFilterBuilderOperationName>Is any of</ng-template>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;MAMa,mCAAmC,CAAA;AACrC,IAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;uGAD/B,mCAAmC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAnC,mCAAmC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iCAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAnC,mCAAmC,EAAA,UAAA,EAAA,CAAA;kBAJ/C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iCAAiC;AAC3C,oBAAA,UAAU,EAAE;AACb,iBAAA;;;MCCY,mCAAmC,CAAA;AACrC,IAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;uGAD/B,mCAAmC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAnC,mCAAmC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iCAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAnC,mCAAmC,EAAA,UAAA,EAAA,CAAA;kBAJ/C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iCAAiC;AAC3C,oBAAA,UAAU,EAAE;AACb,iBAAA;;;MCGY,kCAAkC,CAAA;IAC7C,EAAE,GAAG,KAAK,CAAC,EAAE,0EACX,KAAK,EAAE,8BAA8B,EAAA,CACrC;AACF,IAAA,gBAAgB,GAAG,KAAK,CAAW,EAAE,uFAAC;AAC7B,IAAA,aAAa,GAAG,YAAY,CAAC,mCAAmC,oFAAC;AACjE,IAAA,aAAa,GAAG,YAAY,CAAC,mCAAmC,oFAAC;uGAN/D,kCAAkC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAlC,kCAAkC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gCAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,8BAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,gBAAA,EAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,eAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAKP,mCAAmC,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,eAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EACnC,mCAAmC,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAN9D,kCAAkC,EAAA,UAAA,EAAA,CAAA;kBAJ9C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gCAAgC;AAC1C,oBAAA,UAAU,EAAE;AACb,iBAAA;AAMuC,SAAA,CAAA,EAAA,cAAA,EAAA,EAAA,EAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,8BAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAAA,mCAAmC,+FACnC,mCAAmC,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;MC0C9D,aAAa,CAAA;AACd,IAAA,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC;IAChC,SAAS,GAAG,gBAAgB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;AACjD,IAAA,yBAAyB,GAA0B,IAAI,GAAG,EAAE;AAC9D,IAAA,eAAe,GAAoE;QACzF,mBAAmB,EAAE,IAAI,CAAC,iBAAiB;QAC3C,oBAAoB,EAAE,IAAI,CAAC,kBAAkB;QAC7C,kBAAkB,EAAE,IAAI,CAAC,gBAAgB;QACzC,mBAAmB,EAAE,IAAI,CAAC,iBAAiB;KAC5C;AAED,IAAA,KAAK,GAAG,KAAK,CAAuB,EAAE,4EAAC;AACvC,IAAA,SAAS,GAAG,KAAK,CAA0B,EAAE,gFAAC;AAC9C,IAAA,UAAU,GAAG,KAAK,CAAC,EAAE,iFAAC;IACtB,eAAe,GAAG,KAAK,CAAC;AACtB,QAAA;AACE,YAAA,EAAE,EAAE,KAAK;AACT,YAAA,IAAI,EAAE;AACP,SAAA;AACD,QAAA;AACE,YAAA,EAAE,EAAE,IAAI;AACR,YAAA,IAAI,EAAE;AACP;AACF,KAAA,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AACF,IAAA,gBAAgB,GAAG,KAAK,CAAC,EAAE,uFAAC;IAElB,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE;AAChD,IAAA,sBAAsB,GAAG,YAAY,CAAC,kCAAkC,6FAAC;AACzE,IAAA,oBAAoB,GAAG,eAAe,CAAC,kCAAkC,2FAAC;IACzE,cAAc,GAAyC,EAAE;IAE1D,YAAY,GAAG,MAAM,EAAwB;IAE5C,MAAM,GAAyB,EAAE;IACjC,WAAW,GAAU,EAAE;AACvB,IAAA,QAAQ;IACR,kBAAkB,GAAU,EAAE;IAExC,QAAQ,GAAA;AACN,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE;AACvB,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE;AACnC,gBAAA,MAAM,IAAI,KAAK,CAAC,8DAA8D,CAAC;YACjF;AAEA,YAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAW;YACpE,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;QACpE;IACF;IAEA,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,cAAc,GAAG,CAAC,GAAG,IAAI,CAAC,sBAAsB,EAAE,EAAE,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;AACxF,QAAA,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,YAAY,IAAG;AACzC,YAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;AACpB,gBAAA,EAAE,EAAE,YAAY,CAAC,EAAE,EAAE;AACrB,gBAAA,IAAI,EAAE,YAAY,CAAC,aAAa,EAAE,EAAE;AACrC,aAAA,CAAC;YACF,YAAY,CAAC,gBAAgB,EAAE,CAAC,OAAO,CAAC,CAAC,WAAmB,KAAI;gBAC9D,IAAI,CAAC,IAAI,CAAC,yBAAyB,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE;oBACpD,IAAI,CAAC,yBAAyB,CAAC,GAAG,CAAC,WAAW,EAAE,EAAE,CAAC;gBACrD;gBAEA,MAAM,gBAAgB,GAAG,IAAI,CAAC,yBAAyB,CAAC,GAAG,CAAC,WAAW,CAAa;gBACpF,gBAAgB,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC;gBACxC,IAAI,CAAC,yBAAyB,CAAC,GAAG,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACnE,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;AACF,QAAA,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;IAC3B;AAEA,IAAA,YAAY,CAAC,WAAgC,EAAA;AAC3C,QAAA,MAAM,KAAK,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,KAAK;QAC5D,KAAK,CAAC,IAAI,CACR;YACE,KAAK,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE;AAClE,SAAA,CACF;IACH;AAEA,IAAA,QAAQ,CAAC,WAAgC,EAAA;AACvC,QAAA,MAAM,KAAK,GAAG,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,KAAK;QAC5D,KAAK,CAAC,IAAI,CACR;YACE,eAAe,EAAE,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE;AAC7C,YAAA,KAAK,EAAE;AACR,SAAA,CACF;IACH;AAEA,IAAA,iBAAiB,CAAC,SAAiB,EAAA;AACjC,QAAA,OAAO,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS,CAAC;IACtE;AAEA,IAAA,qBAAqB,CAAC,EAAU,EAAA;AAC9B,QAAA,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,SAAS,IAAI,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC;IAChE;AAEA,IAAA,6BAA6B,CAAC,WAAgC,EAAA;AAC5D,QAAA,MAAM,sBAAsB,GAAG,WAAW,GAAG,WAAW,CAAC,eAAe,GAAG,IAAI,CAAC,gBAAgB;QAChG,OAAO,IAAI,CAAC,eAAe,EAAE,CAAC,IAAI,CAAC,aAAa,IAAI,aAAa,CAAC,EAAE,KAAK,sBAAsB,CAAC,EAAE,IAAI,IAAI,EAAE;IAC9G;IAEA,oBAAoB,CAAC,IAA4B,EAAE,KAA4B,EAAA;AAC7E,QAAA,IAAI,YAAY,GAAG,IAAI,CAAC,yBAAyB,CAAC,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAa;QACjF,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,SAAS;QAClC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC;AAClC,QAAA,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC;AAC7B,QAAA,IAAI,CAAC,QAAQ,GAAG,SAAS;QACzB,IAAI,CAAC,gBAAgB,EAAE;IACzB;IAEA,gBAAgB,CAAC,IAA4B,EAAE,SAAiB,EAAA;QAC9D,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAErC,IAAI,YAAY,KAAK,QAAQ,IAAI,SAAS,KAAK,SAAS,EAAE;YACxD,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE;QACvB;aAAO,IAAI,YAAY,KAAK,SAAS,IAAI,SAAS,KAAK,QAAQ,EAAE;YAC/D,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;QACzB;QAEA,IAAI,YAAY,KAAK,WAAW,IAAI,SAAS,KAAK,WAAW,EAAE;YAC7D,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;QACzB;aAAO,IAAI,YAAY,KAAK,WAAW,IAAI,SAAS,KAAK,WAAW,EAAE;YACpE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE;QACvB;QAEA,IAAI,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE;YACjD,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;QACzB;QAEA,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS;AAC5B,QAAA,IAAI,CAAC,QAAQ,GAAG,SAAS;QACzB,IAAI,CAAC,gBAAgB,EAAE;IACzB;IAEA,eAAe,CAAC,KAAa,EAAE,KAA8B,EAAA;AAC3D,QAAA,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;QACtB,IAAI,CAAC,gBAAgB,EAAE;IACzB;IAEA,8BAA8B,CAAC,SAAiB,EAAE,WAAmB,EAAA;AACnE,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,IACtC,CAAC,CAAC,SAAS,KAAK,SAAS,CACD;AAE1B,QAAA,IAAI,YAAY,GAAG,IAAI,CAAC,yBAAyB,CAAC,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC;QAExE,IAAI,CAAC,YAAY,EAAE;YACjB,MAAM,IAAI,KAAK,CAAC,6CAA6C,GAAG,QAAQ,CAAC,QAAQ,CAAC;QACpF;AAEA,QAAA,OAAO,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC;IAC3C;AAEA,IAAA,WAAW,CAAC,IAA4B,EAAA;AACtC,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;AACpB,QAAA,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE;AACzE,YAAA,IAAI,CAAC,kBAAkB,GAAG,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;QACzD;IACF;AAEA,IAAA,YAAY,CAAC,IAA4B,EAAA;QACvC,OAAQ,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,IAC7B,CAAC,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CACP,CAAC,QAAQ;IACtC;AAEA,IAAA,eAAe,CAAC,IAA4B,EAAA;QAC1C,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,OAAO,EAAE;YACvC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,QAAQ,EAAE;AACjC,gBAAA,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE;YAC7D;iBAAO;gBACL,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC;YACpC;QACF;QAEA,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,WAAW,EAAE;AACpC,YAAA,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI;QACtG;AAEA,QAAA,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE;IAC7D;IAEA,UAAU,CAAC,KAAK,GAAG,CAAC,EAAA;QAClB,UAAU,CAAC,MAAK;AACd,YAAA,IAAI,CAAC,QAAQ,GAAG,SAAS;AACzB,YAAA,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;QAC3B,CAAC,EAAE,KAAK,CAAC;IACX;AAEA,IAAA,UAAU,CAAC,IAA4B,EAAA;QACrC,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;AACxC,QAAA,OAAO,QAAQ,CAAC,MAAM,EAAE,UAAgD;IAC1E;IAEA,yBAAyB,CAAC,IAA4B,EAAE,gBAAwB,EAAA;QAC9E,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;QACxC,OAAO,CAAC,QAAQ,CAAC,MAAM,EAAE,UAAiD,EAAC,IAAI,CAC7E,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,gBAAgB,CACrC,EAAE,IAAI,IAAI,EAAE;IACf;AAEA,IAAA,UAAU,CAAC,KAAiB,EAAA;QAC1B,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE;YAC5G;QACF;QACA,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AACvB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB;QAE1C,UAAU,CAAC,MAAK;YACd,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,iBAAiB,CAAC;YAEnD,IAAI,SAAS,EAAE;gBACb,IAAI,CAAC,UAAU,EAAE;YACnB;QACF,CAAC,EAAE,GAAG,CAAC;IACT;IAEA,YAAY,GAAA;QACV,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE;AAC5G,YAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,kBAAkB,CAAC;QAC1D;QACA,IAAI,CAAC,UAAU,EAAE;QACjB,UAAU,CAAC,MAAK;YACd,IAAI,CAAC,gBAAgB,EAAE;AACzB,QAAA,CAAC,CAAC;IACJ;AAEU,IAAA,wBAAwB,CAAC,SAA6C,EAAA;AAC9E,QAAA,OAAO,SAAS,CAAC,aAAa,EAAE,EAAE,WAA+B;IACnE;AAEU,IAAA,wBAAwB,CAAC,SAA6C,EAAA;AAC9E,QAAA,OAAO,SAAS,CAAC,aAAa,EAAE,EAAE,WAA+B;IACnE;AAEU,IAAA,QAAQ,CAAC,IAA2B,EAAA;QAC5C,OAAO,iBAAiB,IAAI,IAAI;IAClC;AAEU,IAAA,YAAY,CAAC,IAA2B,EAAA;AAChD,QAAA,OAAO,EAAE,iBAAiB,IAAI,IAAI,CAAC;IACrC;IAEU,gBAAgB,GAAA;QACxB,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,MAAM,CAAC;AAE/C,QAAA,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;AACpB,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;AACrB,gBAAA;oBACE,eAAe,EAAE,IAAI,CAAC,gBAAgB;AACtC,oBAAA,KAAK,EAAE;AACR;AACF,aAAA,CAAC;QACJ;aAAO;AACL,YAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;QAC5B;IACF;AAEQ,IAAA,YAAY,CAAC,SAAiC,EAAA;QACpD,OAAQ,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,IAC7B,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CACb;IAC5B;IAEQ,WAAW,CAAC,KAA4B,EAAE,SAAiC,EAAA;QACjF,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,CAAC,CAAC,IACtC,CAAC,CAAC,SAAS,KAAK,KAAK,CAAC,SAAS,CACP;AAC1B,QAAA,MAAM,WAAW,GAAG,QAAQ,GAAG,IAAI,CAAC,sBAAsB,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,OAAO;QACvF,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC,SAAS,CAAC;IAC9C;AAEQ,IAAA,iBAAiB,CAAC,SAAiC,EAAA;QACzD,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE;IAC5B;AAEQ,IAAA,iBAAiB,CAAC,SAAiC,EAAA;QACzD,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;IAC9B;AAEQ,IAAA,gBAAgB,CAAC,SAAiC,EAAA;QACxD,IAAI,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,QAAQ,EAAE;YACtC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;QAC9B;aAAO;YACL,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE;QAC5B;IACF;AAEQ,IAAA,kBAAkB,CAAC,SAAiC,EAAA;QAC1D,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK;IAC/B;AAEQ,IAAA,sBAAsB,CAAC,KAAa,EAAA;AAC1C,QAAA,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACvD;AAEQ,IAAA,eAAe,CAAC,KAA8B,EAAA;QACpD,IAAI,MAAM,GAA4B,EAAE;AACxC,QAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAG;AACnB,YAAA,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;gBACvB,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC;AAEnD,gBAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;AACzB,oBAAA,MAAM,GAAG,CAAC,GAAG,MAAM,EAAE;4BACnB,eAAe,EAAE,IAAI,CAAC,eAAe;AACrC,4BAAA,KAAK,EAAE;AACR,yBAAA,CAAC;gBACJ;YACF;iBAAO;AACL,gBAAA,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE;AAC9B,oBAAA,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;gBACnB;YACF;AACF,QAAA,CAAC,CAAC;AACF,QAAA,OAAO,MAAM;IACf;uGA5TW,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAb,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,44BA4BwB,kCAAkC,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,wBAAA,EAAA,SAAA,EADnC,kCAAkC,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnFnF,msbAkRA,EAAA,MAAA,EAAA,CAAA,2lRAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDjPI,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACZ,IAAI,8FACJ,WAAW,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,EAAA,oBAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,WAAA,EAAA,4BAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,YAAA,CAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,IAAI,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACJ,WAAW,EAAA,QAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,wBAAwB,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,CAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACxB,WAAW,ixBACX,QAAQ,EAAA,QAAA,EAAA,gCAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACR,SAAS,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACT,MAAM,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,IAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,eAAA,EAAA,WAAA,EAAA,UAAA,EAAA,kBAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,QAAA,EAAA,aAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACN,MAAM,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACN,kBAAkB,iHAClB,qBAAqB,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,eAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,gBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACrB,KAAK,EAAA,QAAA,EAAA,qCAAA,EAAA,MAAA,EAAA,CAAA,IAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACL,kCAAkC,yIAClC,mCAAmC,EAAA,QAAA,EAAA,iCAAA,EAAA,CAAA,EAAA,CAAA;;2FAQ1B,aAAa,EAAA,UAAA,EAAA,CAAA;kBA3BzB,SAAS;+BACE,oBAAoB,EAAA,QAAA,EACpB,kBAAkB,EAAA,OAAA,EACnB;wBACP,YAAY;wBACZ,IAAI;wBACJ,WAAW;wBACX,IAAI;wBACJ,WAAW;wBACX,wBAAwB;wBACxB,WAAW;wBACX,QAAQ;wBACR,SAAS;wBACT,MAAM;wBACN,MAAM;wBACN,kBAAkB;wBAClB,qBAAqB;wBACrB,KAAK;wBACL,kCAAkC;wBAClC;qBACD,EAAA,IAAA,EAGK;AACJ,wBAAA,OAAO,EAAE;AACV,qBAAA,EAAA,QAAA,EAAA,msbAAA,EAAA,MAAA,EAAA,CAAA,2lRAAA,CAAA,EAAA;AA6B8C,SAAA,CAAA,EAAA,cAAA,EAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,OAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,SAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,WAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,kBAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,sBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAAA,kCAAkC,yGACjC,kCAAkC,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,cAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AEpFpF;;AAEG;;;;"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ngstarter-ui/components",
|
|
3
3
|
"description": "NgStarter - AI-friendly Enterprise Angular UI Components and Admin Panel",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.23",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
7
7
|
"url": "https://github.com/elementarlabsdev/ngstarter.git"
|
|
@@ -15,6 +15,7 @@ interface CommentEditorAPI {
|
|
|
15
15
|
isToolbarActive: () => boolean;
|
|
16
16
|
toggleToolbar: () => void;
|
|
17
17
|
isEditorActivated: () => boolean;
|
|
18
|
+
insertText: (text: string) => void;
|
|
18
19
|
}
|
|
19
20
|
declare const COMMENT_EDITOR: InjectionToken<unknown>;
|
|
20
21
|
declare const COMMENT_EDITOR_BUBBLE_MENU: InjectionToken<unknown>;
|
|
@@ -43,6 +44,7 @@ declare class CommentEditor implements OnInit, OnDestroy {
|
|
|
43
44
|
readonly canceled: i0.OutputEmitterRef<void>;
|
|
44
45
|
ngOnInit(): void;
|
|
45
46
|
get api(): CommentEditorAPI;
|
|
47
|
+
insertText(text: string): void;
|
|
46
48
|
isCommandDisabled(command: string): boolean | null;
|
|
47
49
|
ngOnDestroy(): void;
|
|
48
50
|
send(event: MouseEvent): void;
|