igniteui-angular 22.2.0-rc.1 → 22.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/button-group/README.md +42 -9
- package/calendar/README.md +30 -20
- package/card/README.md +1 -1
- package/fesm2022/igniteui-angular-accordion.mjs +7 -7
- package/fesm2022/igniteui-angular-action-strip.mjs +11 -22
- package/fesm2022/igniteui-angular-action-strip.mjs.map +1 -1
- package/fesm2022/igniteui-angular-avatar.mjs +7 -7
- package/fesm2022/igniteui-angular-badge.mjs +7 -7
- package/fesm2022/igniteui-angular-banner.mjs +10 -10
- package/fesm2022/igniteui-angular-bottom-nav.mjs +22 -22
- package/fesm2022/igniteui-angular-button-group.mjs +32 -35
- package/fesm2022/igniteui-angular-button-group.mjs.map +1 -1
- package/fesm2022/igniteui-angular-calendar.mjs +132 -180
- package/fesm2022/igniteui-angular-calendar.mjs.map +1 -1
- package/fesm2022/igniteui-angular-card.mjs +47 -58
- package/fesm2022/igniteui-angular-card.mjs.map +1 -1
- package/fesm2022/igniteui-angular-carousel.mjs +22 -22
- package/fesm2022/igniteui-angular-chat-extras.mjs +6 -6
- package/fesm2022/igniteui-angular-chat.mjs +12 -12
- package/fesm2022/igniteui-angular-checkbox.mjs +7 -7
- package/fesm2022/igniteui-angular-chips.mjs +10 -10
- package/fesm2022/igniteui-angular-combo.mjs +66 -60
- package/fesm2022/igniteui-angular-combo.mjs.map +1 -1
- package/fesm2022/igniteui-angular-core.mjs +107 -79
- package/fesm2022/igniteui-angular-core.mjs.map +1 -1
- package/fesm2022/igniteui-angular-date-picker.mjs +38 -38
- package/fesm2022/igniteui-angular-dialog.mjs +13 -13
- package/fesm2022/igniteui-angular-directives.mjs +194 -194
- package/fesm2022/igniteui-angular-drop-down.mjs +29 -29
- package/fesm2022/igniteui-angular-expansion-panel.mjs +28 -28
- package/fesm2022/igniteui-angular-grids-core.mjs +737 -661
- package/fesm2022/igniteui-angular-grids-core.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-grid.mjs +69 -58
- package/fesm2022/igniteui-angular-grids-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs +37 -37
- package/fesm2022/igniteui-angular-grids-lite.mjs +25 -17
- package/fesm2022/igniteui-angular-grids-lite.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-pivot-grid.mjs +92 -81
- package/fesm2022/igniteui-angular-grids-pivot-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-tree-grid.mjs +55 -55
- package/fesm2022/igniteui-angular-icon.mjs +10 -10
- package/fesm2022/igniteui-angular-input-group.mjs +25 -25
- package/fesm2022/igniteui-angular-list.mjs +40 -40
- package/fesm2022/igniteui-angular-navbar.mjs +13 -13
- package/fesm2022/igniteui-angular-navigation-drawer.mjs +43 -38
- package/fesm2022/igniteui-angular-navigation-drawer.mjs.map +1 -1
- package/fesm2022/igniteui-angular-paginator.mjs +19 -19
- package/fesm2022/igniteui-angular-progressbar.mjs +19 -19
- package/fesm2022/igniteui-angular-query-builder.mjs +22 -22
- package/fesm2022/igniteui-angular-radio.mjs +25 -21
- package/fesm2022/igniteui-angular-radio.mjs.map +1 -1
- package/fesm2022/igniteui-angular-select.mjs +25 -25
- package/fesm2022/igniteui-angular-simple-combo.mjs +9 -9
- package/fesm2022/igniteui-angular-simple-combo.mjs.map +1 -1
- package/fesm2022/igniteui-angular-slider.mjs +28 -28
- package/fesm2022/igniteui-angular-snackbar.mjs +7 -7
- package/fesm2022/igniteui-angular-splitter.mjs +13 -13
- package/fesm2022/igniteui-angular-stepper.mjs +34 -34
- package/fesm2022/igniteui-angular-switch.mjs +7 -7
- package/fesm2022/igniteui-angular-tabs.mjs +34 -34
- package/fesm2022/igniteui-angular-time-picker.mjs +19 -19
- package/fesm2022/igniteui-angular-toast.mjs +7 -7
- package/fesm2022/igniteui-angular-tree.mjs +28 -28
- package/fesm2022/igniteui-angular-virtual-scroll.mjs +497 -145
- package/fesm2022/igniteui-angular-virtual-scroll.mjs.map +1 -1
- package/migrations/common/UpdateChanges.d.ts +25 -5
- package/migrations/common/UpdateChanges.js +218 -34
- package/migrations/common/UpdateChanges.spec.js +763 -0
- package/migrations/migration-collection.json +1 -1
- package/migrations/update-22_2_0/index.js +145 -0
- package/migrations/update-22_2_0/index.spec.js +133 -0
- package/navigation-drawer/README.md +1 -1
- package/package.json +4 -4
- package/schematics/tsconfig.tsbuildinfo +1 -1
- package/skills/igniteui-angular-components/SKILL.md +9 -5
- package/skills/igniteui-angular-components/references/form-controls.md +1 -1
- package/skills/igniteui-angular-components/references/mcp-setup.md +14 -2
- package/skills/igniteui-angular-figma-to-app/SKILL.md +112 -525
- package/skills/igniteui-angular-figma-to-app/references/asset-extraction.md +49 -75
- package/skills/igniteui-angular-figma-to-app/references/design-provenance.md +201 -0
- package/skills/igniteui-angular-figma-to-app/references/design-token-bridge.md +175 -52
- package/skills/igniteui-angular-figma-to-app/references/figma-component-map.md +153 -99
- package/skills/igniteui-angular-figma-to-app/references/figma-exploration.md +226 -0
- package/skills/igniteui-angular-figma-to-app/references/mcp-setup.md +71 -105
- package/skills/igniteui-angular-figma-to-app/references/project-setup.md +63 -0
- package/skills/igniteui-angular-figma-to-app/references/theme-generation.md +120 -0
- package/skills/igniteui-angular-figma-to-app/references/validation-patterns.md +48 -50
- package/skills/igniteui-angular-generate-from-image-design/SKILL.md +11 -7
- package/skills/igniteui-angular-grids/SKILL.md +7 -3
- package/skills/igniteui-angular-grids/references/editing.md +1 -2
- package/skills/igniteui-angular-grids/references/grid-migration.md +1 -1
- package/skills/igniteui-angular-theming/SKILL.md +9 -5
- package/skills/igniteui-angular-theming/references/mcp-setup.md +12 -2
- package/types/igniteui-angular-button-group.d.ts +49 -34
- package/types/igniteui-angular-calendar.d.ts +33 -50
- package/types/igniteui-angular-card.d.ts +12 -17
- package/types/igniteui-angular-combo.d.ts +6 -0
- package/types/igniteui-angular-core.d.ts +10 -2
- package/types/igniteui-angular-grids-core.d.ts +48 -4
- package/types/igniteui-angular-grids-grid.d.ts +4 -0
- package/types/igniteui-angular-grids-lite.d.ts +5 -1
- package/types/igniteui-angular-grids-pivot-grid.d.ts +5 -1
- package/types/igniteui-angular-navigation-drawer.d.ts +1 -0
- package/types/igniteui-angular-radio.d.ts +5 -0
- package/types/igniteui-angular-virtual-scroll.d.ts +41 -13
- package/virtual-scroll/README.md +32 -1
|
@@ -72,10 +72,10 @@ class IgxQueryBuilderHeaderComponent {
|
|
|
72
72
|
this._customResourceStrings = this._resourceStrings ? Object.assign({}, this._defaultResourceStrings, this._resourceStrings) : null;
|
|
73
73
|
}, this);
|
|
74
74
|
}
|
|
75
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
76
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.
|
|
75
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
76
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.2.0", type: IgxQueryBuilderHeaderComponent, isStandalone: true, selector: "igx-query-builder-header", inputs: { title: "title", showLegend: "showLegend", resourceStrings: "resourceStrings" }, host: { properties: { "class": "this.getClass" } }, ngImport: i0, template: "<div class=\"igx-query-builder__title\">{{ title }}</div>\n<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
77
77
|
}
|
|
78
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
78
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderHeaderComponent, decorators: [{
|
|
79
79
|
type: Component,
|
|
80
80
|
args: [{ selector: 'igx-query-builder-header', changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"igx-query-builder__title\">{{ title }}</div>\n<ng-content></ng-content>\n" }]
|
|
81
81
|
}], ctorParameters: () => [], propDecorators: { getClass: [{
|
|
@@ -93,10 +93,10 @@ class IgxFieldFormatterPipe {
|
|
|
93
93
|
transform(value, formatter, rowData, fieldData) {
|
|
94
94
|
return formatter(value, rowData, fieldData);
|
|
95
95
|
}
|
|
96
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
97
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.
|
|
96
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxFieldFormatterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
97
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxFieldFormatterPipe, isStandalone: true, name: "fieldFormatter" }); }
|
|
98
98
|
}
|
|
99
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
99
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxFieldFormatterPipe, decorators: [{
|
|
100
100
|
type: Pipe,
|
|
101
101
|
args: [{
|
|
102
102
|
name: 'fieldFormatter',
|
|
@@ -598,10 +598,10 @@ class IgxQueryBuilderDragService {
|
|
|
598
598
|
}
|
|
599
599
|
}, DEFAULT_SET_Z_INDEX_DELAY);
|
|
600
600
|
}
|
|
601
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
602
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.
|
|
601
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderDragService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
602
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderDragService }); }
|
|
603
603
|
}
|
|
604
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
604
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderDragService, decorators: [{
|
|
605
605
|
type: Injectable
|
|
606
606
|
}] });
|
|
607
607
|
|
|
@@ -1885,12 +1885,12 @@ class IgxQueryBuilderTreeComponent {
|
|
|
1885
1885
|
this._defaultResourceStrings = getCurrentResourceStrings(QueryBuilderResourceStringsEN, false, locale);
|
|
1886
1886
|
this._customResourceStrings = this._resourceStrings ? Object.assign({}, this._defaultResourceStrings, this._resourceStrings) : null;
|
|
1887
1887
|
}
|
|
1888
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
1889
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.
|
|
1888
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1889
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.0", type: IgxQueryBuilderTreeComponent, isStandalone: true, selector: "igx-query-builder-tree", inputs: { entities: "entities", queryBuilder: "queryBuilder", searchValueTemplate: "searchValueTemplate", parentExpression: "parentExpression", fields: "fields", expressionTree: "expressionTree", locale: "locale", resourceStrings: "resourceStrings", expectedReturnField: "expectedReturnField" }, outputs: { expressionTreeChange: "expressionTreeChange", inEditModeChange: "inEditModeChange" }, host: { properties: { "class": "this.getClass" }, classAttribute: "igx-query-builder-tree" }, providers: [
|
|
1890
1890
|
IgxQueryBuilderDragService
|
|
1891
1891
|
], viewQueries: [{ propertyName: "entitySelect", first: true, predicate: ["entitySelect"], descendants: true, read: IgxSelectComponent }, { propertyName: "editingInputs", first: true, predicate: ["editingInputs"], descendants: true, read: ElementRef }, { propertyName: "returnFieldsCombo", first: true, predicate: ["returnFieldsCombo"], descendants: true, read: IgxComboComponent }, { propertyName: "returnFieldSelect", first: true, predicate: ["returnFieldSelect"], descendants: true, read: IgxSelectComponent }, { propertyName: "fieldSelect", first: true, predicate: ["fieldSelect"], descendants: true, read: IgxSelectComponent }, { propertyName: "conditionSelect", first: true, predicate: ["conditionSelect"], descendants: true, read: IgxSelectComponent }, { propertyName: "searchValueInput", first: true, predicate: ["searchValueInput"], descendants: true, read: ElementRef }, { propertyName: "picker", first: true, predicate: ["picker"], descendants: true }, { propertyName: "addRootAndGroupButton", first: true, predicate: ["addRootAndGroupButton"], descendants: true, read: ElementRef }, { propertyName: "addConditionButton", first: true, predicate: ["addConditionButton"], descendants: true, read: ElementRef }, { propertyName: "entityChangeDialog", first: true, predicate: ["entityChangeDialog"], descendants: true, read: IgxDialogComponent }, { propertyName: "addExpressionItemDropDown", first: true, predicate: ["addOptionsDropDown"], descendants: true, read: IgxDropDownComponent }, { propertyName: "groupContextMenuDropDown", first: true, predicate: ["groupContextMenuDropDown"], descendants: true, read: IgxDropDownComponent }, { propertyName: "editingInputsContainer", first: true, predicate: ["editingInputsContainer"], descendants: true, read: ElementRef }, { propertyName: "currentGroupButtonsContainer", first: true, predicate: ["currentGroupButtonsContainer"], descendants: true, read: ElementRef }, { propertyName: "expressionsContainer", first: true, predicate: ["expressionsContainer"], descendants: true }, { propertyName: "expressionsChips", predicate: IgxChipComponent, descendants: true, read: IgxChipComponent }, { propertyName: "innerQueries", predicate: IgxQueryBuilderTreeComponent, descendants: true }], ngImport: i0, template: "<ng-template #addIcon>\n <igx-icon family=\"default\" name=\"add\"></igx-icon>\n</ng-template>\n\n<ng-template #closeIcon>\n <igx-icon family=\"default\" name=\"close\"></igx-icon>\n</ng-template>\n\n<ng-template #selectFromTemplate>\n <div\n class=\"igx-filter-tree__inputs\"\n [style.display]=\"\n isInEditMode() &&\n (!this.isAdvancedFiltering() || this.isHierarchicalNestedQuery())\n ? 'flex'\n : 'none'\n \"\n >\n <div class=\"igx-filter-tree__inputs-field\">\n <span class=\"igx-query-builder__label\">{{\n this.resourceStrings.igx_query_builder_from_label\n }}</span>\n <igx-select\n #entitySelect\n type=\"box\"\n (selectionChanging)=\"onEntitySelectChanging($event)\"\n (opening)=\"exitEditAddMode(true)\"\n [overlaySettings]=\"entitySelectOverlaySettings\"\n [ngModel]=\"selectedEntity\"\n [style.display]=\"isInEditMode() ? 'block' : 'none'\"\n [placeholder]=\"this.resourceStrings.igx_query_builder_select_entity!\"\n [disabled]=\"disableEntityChange\"\n >\n @for (entity of entities; track entity.name) {\n <igx-select-item [value]=\"entity\">\n {{ entity.name }}\n </igx-select-item>\n }\n </igx-select>\n </div>\n\n <div class=\"igx-filter-tree__inputs-field\">\n @if (!this.isHierarchicalNestedQuery()) {\n <span class=\"igx-query-builder__label\">{{\n this.resourceStrings.igx_query_builder_select_label\n }}</span>\n }\n @if (!parentExpression) {\n <igx-combo\n #returnFieldsCombo\n [itemsMaxHeight]=\"250\"\n [data]=\"fields\"\n [displayKey]=\"'field'\"\n [valueKey]=\"'field'\"\n [disabled]=\"disableReturnFieldsChange\"\n [(ngModel)]=\"selectedReturnFields\"\n [overlaySettings]=\"returnFieldSelectOverlaySettings\"\n [placeholder]=\"this.resourceStrings.igx_query_builder_select_return_fields!\"\n [searchPlaceholder]=\"this.resourceStrings.igx_query_builder_search!\"\n [style.display]=\"isInEditMode() ? 'block' : 'none'\"\n (selectionChanging)=\"onReturnFieldSelectChanging($event)\"\n (opening)=\"exitEditAddMode()\"\n >\n <ng-template igxComboHeader>\n <div\n class=\"igx-drop-down__item igx-drop-down__item--query-builder\"\n (click)=\"onSelectAllClicked()\"\n [ngClass]=\"{\n 'igx-drop-down__item--selected':\n this.selectedEntity &&\n this.selectedReturnFields &&\n this.selectedEntity.fields.length ===\n this.selectedReturnFields.length,\n }\"\n >\n <igx-checkbox\n [checked]=\"\n this.selectedEntity &&\n this.selectedReturnFields &&\n this.selectedEntity.fields.length ===\n this.selectedReturnFields.length\n \"\n [indeterminate]=\"\n this.selectedEntity &&\n this.selectedReturnFields &&\n this.selectedReturnFields.length > 0 &&\n this.selectedReturnFields.length < this.selectedEntity.fields.length\n \"\n [readonly]=\"true\"\n [disableRipple]=\"true\"\n [tabindex]=\"-1\"\n class=\"igx-combo__checkbox\"\n >\n </igx-checkbox>\n <div class=\"igx-drop-down__inner\">\n {{ this.resourceStrings.igx_query_builder_select_all }}\n </div>\n </div>\n </ng-template>\n </igx-combo>\n } @else {\n <igx-select\n #returnFieldSelect\n type=\"box\"\n (selectionChanging)=\"onReturnFieldSelectChanging($event)\"\n [overlaySettings]=\"returnFieldSelectOverlaySettings\"\n [disabled]=\"!selectedEntity\"\n [ngModel]=\"selectedReturnFields ? selectedReturnFields[0] : null\"\n [placeholder]=\"this.resourceStrings.igx_query_builder_select_return_field_single!\"\n [style.display]=\"isInEditMode() ? 'block' : 'none'\"\n (opening)=\"exitEditAddMode()\"\n >\n @for (field of fields; track field.field) {\n <igx-select-item [value]=\"field.field\">\n {{ field.field }}\n </igx-select-item>\n }\n </igx-select>\n }\n </div>\n </div>\n</ng-template>\n\n<div #expressionsContainer class=\"igx-query-builder__main\">\n <ng-container *ngTemplateOutlet=\"selectFromTemplate\"></ng-container>\n\n <ng-template\n #addExpressionsTemplate\n let-expressionItem\n let-afterExpression=\"afterExpression\"\n >\n <button\n type=\"button\"\n #addConditionButton\n igxButton=\"flat\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addCondition(expressionItem, afterExpression, true)\"\n igxDrop\n (enter)=\"\n dragService.onAddConditionEnter(addConditionButton, expressionItem)\n \"\n (leave)=\"dragService.onChipLeave()\"\n >\n <ng-container *ngTemplateOutlet=\"addIcon\"></ng-container>\n <span>{{\n this.resourceStrings.igx_query_builder_add_condition_root\n }}</span>\n </button>\n\n @if (this.rootGroup) {\n <button\n type=\"button\"\n igxButton=\"flat\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addReverseGroup(expressionItem, afterExpression)\"\n >\n <ng-container *ngTemplateOutlet=\"addIcon\"></ng-container>\n <span>{{ this.resourceStrings.igx_query_builder_add_group_root }}</span>\n </button>\n }\n </ng-template>\n\n <ng-template #operandTemplate let-expressionItem>\n @if (!expressionItem.inEditMode) {\n @if (\n dragService.dropGhostExpression &&\n expressionItem === dragService.dropGhostExpression &&\n dragService.isKeyboardDrag === false\n ) {\n <div\n class=\"igx-filter-tree__expression-item igx-filter-tree__expression-item-drop-ghost\"\n >\n <igx-chip [data]=\"expressionItem\">\n {{ this.resourceStrings.igx_query_builder_drop_ghost_text }}\n </igx-chip>\n </div>\n } @else {\n <div\n #dragRef\n igxDrop\n (enter)=\"dragService.onChipEnter(dragRef, expressionItem)\"\n (over)=\"dragService.onDivOver(dragRef, expressionItem)\"\n (leave)=\"dragService.onChipLeave()\"\n (dropped)=\"dragService.onDivDropped(expressionItem)\"\n [ngClass]=\"{\n 'igx-filter-tree__expression-item': true,\n 'igx-filter-tree__expression-item-keyboard-ghost':\n expressionItem === dragService.dropGhostExpression,\n }\"\n (mouseenter)=\"expressionItem.hovered = true\"\n (mouseleave)=\"expressionItem.hovered = false\"\n (focusin)=\"onExpressionFocus(expressionItem)\"\n (focusout)=\"onExpressionBlur($event, expressionItem)\"\n >\n <igx-chip\n #expressionChip\n [draggable]=\"true\"\n [hideBaseOnDrag]=\"false\"\n [animateOnRelease]=\"false\"\n (moveStart)=\"\n dragService.onMoveStart(dragRef, expressionItem, false)\n \"\n (moveEnd)=\"dragService.onMoveEnd()\"\n (dragEnter)=\"dragService.onChipEnter(dragRef, expressionItem)\"\n (dragOver)=\"dragService.onChipOver(dragRef)\"\n (dragLeave)=\"dragService.onChipLeave()\"\n (dragDrop)=\"dragService.onChipDropped()\"\n #target=\"tooltipTarget\"\n [igxTooltipTarget]=\"tooltipRef\"\n [data]=\"expressionItem\"\n [removable]=\"isInEditMode() ? 'true' : 'false'\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"onChipClick(expressionItem, expressionChip)\"\n (remove)=\"onChipRemove(expressionItem)\"\n >\n <igx-icon\n igxPrefix\n class=\"igx-drag-indicator\"\n tabindex=\"0\"\n (focus)=\"\n dragService.onChipDragIndicatorFocus(dragRef, expressionItem)\n \"\n (focusout)=\"dragService.onChipDragIndicatorFocusOut()\"\n family=\"default\"\n name=\"drag_indicator\"\n >\n </igx-icon>\n <span igxPrefix class=\"igx-filter-tree__expression-column\">\n {{\n expressionItem.fieldLabel || expressionItem.expression.fieldName\n }}\n </span>\n <span igxPrefix class=\"igx-filter-tree__expression-condition\">\n {{\n getConditionFriendlyName(\n $safeNavigationMigration(\n expressionItem.expression.condition?.name\n )\n )\n }}\n </span>\n @if (!expressionItem.expression.condition?.isUnary) {\n <span>\n @if (expressionItem.expression.searchTree) {\n <ng-container>\n <strong>{{\n expressionItem.expression.searchTree.entity\n }}</strong\n > /\n {{\n formatReturnFields(expressionItem.expression.searchTree)\n }}\n </ng-container>\n } @else {\n <ng-container>\n @if (isDate(expressionItem.expression.searchVal)) {\n @if (getFormatter(expressionItem.expression.fieldName)) {\n {{\n expressionItem.expression.searchVal\n | fieldFormatter\n : $any(getFormatter(\n expressionItem.expression.fieldName\n ))\n : undefined\n }}\n } @else {\n {{\n expressionItem.expression.searchVal\n | date\n : getFormat(expressionItem.expression.fieldName)\n : undefined\n : this.locale\n }}\n }\n } @else {\n @if (getFormatter(expressionItem.expression.fieldName)) {\n {{\n expressionItem.expression.searchVal\n | fieldFormatter\n : $any(getFormatter(\n expressionItem.expression.fieldName\n ))\n : expressionItem.expression.conditionName ||\n expressionItem.expression.condition?.name\n }}\n } @else {\n {{ expressionItem.expression.searchVal }}\n }\n }\n </ng-container>\n }\n </span>\n }\n </igx-chip>\n <div #tooltipRef=\"tooltip\" igxTooltip>\n @if (expressionItem.expression.searchTree) {\n {{ expressionItem.expression.searchTree.returnFields.join(', ') }}\n } @else if (expressionItem.expression.condition?.isUnary) {\n {{\n getConditionFriendlyName(\n $safeNavigationMigration(\n expressionItem.expression.condition?.name\n )\n )\n }}\n } @else {\n @if (getFormatter(expressionItem.expression.fieldName)) {\n {{\n expressionItem.expression.searchVal\n | fieldFormatter\n : $any(getFormatter(expressionItem.expression.fieldName))\n : expressionItem.expression.conditionName ||\n expressionItem.expression.condition?.name\n }}\n } @else {\n {{ expressionItem.expression.searchVal }}\n }\n }\n </div>\n\n @if (expressionItem.focused || expressionItem.hovered) {\n <div igxDragIgnore class=\"igx-filter-tree__expression-actions\">\n <button\n #addExpressionButton\n igxDragIgnore\n igxIconButton=\"outlined\"\n [igxDropDownItemNavigation]=\"addOptionsDropDown\"\n aria-labelledby=\"add-expression\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"\n clickExpressionAdd(addExpressionButton, expressionChip)\n \"\n (blur)=\"addExpressionBlur()\"\n >\n <igx-icon\n id=\"add-expression\"\n family=\"default\"\n name=\"add\"\n ></igx-icon>\n </button>\n <igx-drop-down\n #addOptionsDropDown\n (selectionChanging)=\"enterExpressionAdd($event, expressionItem)\"\n >\n <igx-drop-down-item [value]=\"'addCondition'\">\n <span>{{\n this.resourceStrings.igx_query_builder_add_condition\n }}</span>\n </igx-drop-down-item>\n <igx-drop-down-item [value]=\"'addGroup'\">\n <span>{{\n this.resourceStrings.igx_query_builder_add_group\n }}</span>\n </igx-drop-down-item>\n </igx-drop-down>\n </div>\n }\n </div>\n }\n }\n <div #editingInputsContainer class=\"igx-filter-tree__subquery\">\n @if (expressionItem.inEditMode) {\n <div\n #editingInputs\n igxDrop\n (enter)=\"\n dragService.onChipEnter(editingInputsContainer, expressionItem)\n \"\n (over)=\"\n dragService.onChipEnter(editingInputsContainer, expressionItem)\n \"\n (leave)=\"dragService.onChipLeave()\"\n (dropped)=\"dragService.onDivDropped(expressionItem)\"\n class=\"igx-filter-tree__inputs\"\n >\n <igx-select\n #fieldSelect\n type=\"box\"\n [overlaySettings]=\"fieldSelectOverlaySettings\"\n [(ngModel)]=\"selectedField\"\n [disabled]=\"!fields\"\n [placeholder]=\"this.resourceStrings.igx_query_builder_column_placeholder!\"\n >\n @for (field of fields; track field) {\n <igx-select-item [value]=\"field\">\n {{ field.label || field.header || field.field }}\n </igx-select-item>\n }\n </igx-select>\n\n <igx-select\n #conditionSelect\n type=\"box\"\n [overlaySettings]=\"conditionSelectOverlaySettings\"\n [(ngModel)]=\"selectedCondition\"\n (selectionChanging)=\"onConditionSelectChanging($event)\"\n [disabled]=\"!selectedField\"\n [placeholder]=\"this.resourceStrings.igx_query_builder_condition_placeholder!\"\n >\n @if (\n selectedField &&\n conditionSelect.value &&\n selectedField.filters!.condition(conditionSelect.value)\n ) {\n <igx-prefix>\n <igx-icon\n family=\"default\"\n [name]=\"\n selectedField.filters!.condition(conditionSelect.value)\n .iconName\n \"\n >\n </igx-icon>\n </igx-prefix>\n }\n\n @for (condition of getConditionList(); track condition) {\n <igx-select-item\n [value]=\"condition\"\n [text]=\"getConditionFriendlyName(condition)\"\n >\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon\n family=\"default\"\n [name]=\"selectedField!.filters!.condition(condition).iconName\"\n >\n </igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{\n getConditionFriendlyName(condition)\n }}</span>\n </div>\n </igx-select-item>\n }\n </igx-select>\n\n <ng-container\n *ngTemplateOutlet=\"\n searchValueTemplate\n ? searchValueTemplate\n : defaultSearchValueTemplate;\n context: getSearchValueTemplateContext(defaultSearchValueTemplate)\n \"\n >\n </ng-container>\n\n <ng-template #defaultSearchValueTemplate>\n @if (\n !selectedField ||\n (selectedField.dataType !== 'date' &&\n selectedField.dataType !== 'time' &&\n selectedField.dataType !== 'dateTime')\n ) {\n <igx-input-group type=\"box\">\n <input\n #searchValueInput\n igxInput\n [disabled]=\"isSearchValueInputDisabled()\"\n [placeholder]=\"\n this.selectedCondition === 'inQuery' ||\n this.selectedCondition === 'notInQuery'\n ? this.resourceStrings\n .igx_query_builder_query_value_placeholder\n : this.resourceStrings.igx_query_builder_value_placeholder\n \"\n [type]=\"\n selectedField && selectedField.dataType === 'number'\n ? 'number'\n : 'text'\n \"\n [(ngModel)]=\"searchValue.value\"\n />\n </igx-input-group>\n } @else if (selectedField && selectedField.dataType === 'date') {\n <igx-date-picker\n #picker\n [(value)]=\"searchValue.value\"\n (keydown)=\"openPicker($event)\"\n (click)=\"picker.open()\"\n type=\"box\"\n [disabled]=\"isSearchValueInputDisabled()\"\n [locale]=\"this.locale\"\n [formatter]=\"selectedField.formatter!\"\n [displayFormat]=\"selectedField.pipeArgs!.format!\"\n [weekStart]=\"selectedField.pipeArgs!.weekStart!\"\n [placeholder]=\"\n this.resourceStrings.igx_query_builder_date_placeholder\n !\"\n >\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n } @else if (selectedField && selectedField.dataType === 'time') {\n <igx-time-picker\n #picker\n [(value)]=\"searchValue.value\"\n (click)=\"picker.open()\"\n (keydown)=\"openPicker($event)\"\n type=\"box\"\n [disabled]=\"isSearchValueInputDisabled()\"\n [locale]=\"this.locale\"\n [formatter]=\"selectedField.formatter!\"\n [displayFormat]=\"selectedField.pipeArgs!.format!\"\n [inputFormat]=\"selectedField.editorOptions!.dateTimeFormat!\"\n [placeholder]=\"\n this.resourceStrings.igx_query_builder_time_placeholder\n !\"\n >\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n } @else if (\n selectedField && selectedField.dataType === 'dateTime'\n ) {\n <igx-input-group #inputGroup type=\"box\">\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"\n this.resourceStrings.igx_query_builder_datetime_placeholder\n \"\n [(ngModel)]=\"searchValue.value\"\n [disabled]=\"isSearchValueInputDisabled()\"\n [locale]=\"this.locale\"\n [igxDateTimeEditor]=\"selectedField.editorOptions?.dateTimeFormat!\"\n [defaultFormatType]=\"selectedField.dataType\"\n [displayFormat]=\"selectedField.pipeArgs!.format!\"\n />\n </igx-input-group>\n }\n </ng-template>\n\n <div class=\"igx-filter-tree__inputs-actions\">\n <button\n type=\"button\"\n igxIconButton=\"outlined\"\n [disabled]=\"!operandCanBeCommitted()\"\n (click)=\"commitExpression()\"\n >\n <igx-icon family=\"default\" name=\"confirm\"></igx-icon>\n </button>\n <button\n type=\"button\"\n igxIconButton=\"outlined\"\n (click)=\"discardExpression(expressionItem)\"\n >\n <ng-container *ngTemplateOutlet=\"closeIcon\"></ng-container>\n </button>\n </div>\n </div>\n }\n\n @if (\n (!expressionItem.inEditMode &&\n expressionItem.expression.searchTree &&\n expressionItem.expression.searchTree.filteringOperands?.length > 0) ||\n (expressionItem.inEditMode &&\n selectedField?.filters?.condition(selectedCondition)?.isNestedQuery)\n ) {\n <ng-container>\n <igx-query-builder-tree\n [style.display]=\"\n expressionItem.inEditMode || expressionItem.expanded\n ? 'block'\n : 'none'\n \"\n [entities]=\"\n (this.selectedEntity\n ? this.selectedEntity.childEntities\n : entities?.[0]?.childEntities) ??\n entities ?? []\n \"\n [queryBuilder]=\"this.queryBuilder\"\n [parentExpression]=\"expressionItem\"\n [expectedReturnField]=\"this.selectedField?.field\"\n [expressionTree]=\"\n expressionItem.inEditMode\n ? (innerQueryNewExpressionTree ||\n getExpressionTreeCopy(\n expressionItem.expression.searchTree,\n true\n ))\n : expressionItem.expression.searchTree\n \"\n (inEditModeChange)=\"onInEditModeChanged($event)\"\n [searchValueTemplate]=\"searchValueTemplate\"\n [resourceStrings]=\"resourceStrings\"\n >\n </igx-query-builder-tree>\n </ng-container>\n }\n </div>\n </ng-template>\n\n <ng-template #expressionGroupTemplate let-expressionItem>\n <div\n class=\"igx-filter-tree\"\n (focusout)=\"parentExpression ? null : dragService.onDragFocusOut()\"\n >\n <div\n class=\"igx-filter-tree__line\"\n [ngClass]=\"{\n 'igx-filter-tree__line--and': getOperator(expressionItem) === 0,\n 'igx-filter-tree__line--or': getOperator(expressionItem) === 1,\n }\"\n ></div>\n\n <div class=\"igx-filter-tree__expressions\">\n <div\n class=\"igx-filter-tree__expression-context-menu\"\n #groupRef\n igxDrop\n (enter)=\"dragService.onGroupRootOver(groupRef, expressionItem)\"\n (over)=\"dragService.onGroupRootOver(groupRef, expressionItem)\"\n (leave)=\"dragService.onChipLeave()\"\n >\n <button\n #changeGroupButton\n [ngClass]=\"{\n 'igx-filter-tree__button--and': getOperator(expressionItem) === 0,\n 'igx-filter-tree__button--or': getOperator(expressionItem) === 1,\n }\"\n [igxDropDownItemNavigation]=\"groupContextMenuDropDown\"\n igxDragIgnore\n igxButton=\"flat\"\n aria-labelledby=\"change-group\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"\n onGroupClick(\n groupContextMenuDropDown,\n changeGroupButton,\n expressionItem\n )\n \"\n >\n <span\n igxDrop\n (enter)=\"dragService.onGroupRootOver(groupRef, expressionItem)\"\n (over)=\"dragService.onGroupRootOver(groupRef, expressionItem)\"\n (leave)=\"dragService.onChipLeave()\"\n >\n {{\n getOperator(expressionItem) === 0\n ? this.resourceStrings.igx_query_builder_and_label\n : this.resourceStrings.igx_query_builder_or_label\n }}\n </span>\n <igx-icon\n family=\"default\"\n name=\"arrow_drop_down\"\n role=\"button\"\n ></igx-icon>\n </button>\n <igx-drop-down\n #groupContextMenuDropDown\n (selectionChanging)=\"\n onGroupContextMenuDropDownSelectionChanging($event)\n \"\n [width]=\"'fit-content'\"\n >\n <igx-drop-down-item [value]=\"'switchCondition'\">\n {{ getSwitchGroupText(expressionItem) }}\n </igx-drop-down-item>\n <igx-drop-down-item\n [value]=\"'ungroup'\"\n [disabled]=\"this.rootGroup === this.contextualGroup\"\n >\n {{ this.resourceStrings.igx_query_builder_ungroup }}\n </igx-drop-down-item>\n </igx-drop-down>\n </div>\n <div class=\"igx-filter-tree__expression-section\">\n @for (\n expr of expressionItem?.children;\n track trackExpressionItem(expr)\n ) {\n <ng-container>\n <ng-container\n *ngTemplateOutlet=\"\n isExpressionGroup(expr)\n ? expressionGroupTemplate\n : operandTemplate;\n context: context(expr)\n \"\n >\n </ng-container>\n </ng-container>\n }\n </div>\n\n @if (expressionItem === rootGroup && !hasEditedExpression) {\n <div #currentGroupButtonsContainer class=\"igx-filter-tree__buttons\">\n <ng-container\n *ngTemplateOutlet=\"\n addExpressionsTemplate;\n context: context(expressionItem)\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n </div>\n </ng-template>\n\n @if (\n rootGroup ||\n (!rootGroup &&\n (selectedEntity || (entities?.length === 1 && !entities[0]?.name)))\n ) {\n <div class=\"igx-filter-tree__section\">\n @if (!this.isAdvancedFiltering()) {\n <span class=\"igx-query-builder__label\">Where</span>\n }\n <ng-container\n *ngTemplateOutlet=\"expressionGroupTemplate; context: context(rootGroup)\"\n ></ng-container>\n </div>\n }\n</div>\n\n<igx-dialog\n #entityChangeDialog\n title=\"{{ this.resourceStrings.igx_query_builder_dialog_title }}\"\n leftButtonLabel=\"{{ this.resourceStrings.igx_query_builder_dialog_cancel }}\"\n rightButtonLabel=\"{{ this.resourceStrings.igx_query_builder_dialog_confirm }}\"\n (leftButtonSelect)=\"onEntityChangeCancel()\"\n (rightButtonSelect)=\"onEntityChangeConfirm()\"\n>\n <section class=\"igx-query-builder-dialog\">\n <p>{{ this.resourceStrings.igx_query_builder_dialog_message }}</p>\n <igx-checkbox\n (change)=\"onShowEntityChangeDialogChange($event)\"\n [disableRipple]=\"true\"\n [tabindex]=\"-1\"\n >\n {{ this.resourceStrings.igx_query_builder_dialog_checkbox_text }}\n </igx-checkbox>\n </section>\n</igx-dialog>\n", dependencies: [{ kind: "component", type: IgxQueryBuilderTreeComponent, selector: "igx-query-builder-tree", inputs: ["entities", "queryBuilder", "searchValueTemplate", "parentExpression", "fields", "expressionTree", "locale", "resourceStrings", "expectedReturnField"], outputs: ["expressionTreeChange", "inEditModeChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxLabel"], outputs: ["buttonSelected"] }, { kind: "component", type: IgxCheckboxComponent, selector: "igx-checkbox", inputs: ["indeterminate", "checked", "disabled", "invalid", "readonly", "disableTransitions"] }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["variant", "id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "outlined", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxComboComponent, selector: "igx-combo", inputs: ["autoFocusSearch", "searchPlaceholder"], outputs: ["selectionChanging", "selectionChanged"] }, { kind: "directive", type: IgxComboHeaderDirective, selector: "[igxComboHeader]" }, { kind: "component", type: IgxDatePickerComponent, selector: "igx-date-picker", inputs: ["hideOutsideDays", "displayMonthsCount", "orientation", "showWeekNumbers", "activeDate", "formatter", "todayButtonLabel", "cancelButtonLabel", "spinLoop", "spinDelta", "id", "formatViews", "disabledDates", "specialDates", "calendarFormat", "value", "minValue", "maxValue", "resourceStrings", "readOnly"], outputs: ["valueChange", "validationFailed"] }, { kind: "directive", type: IgxDateTimeEditorDirective, selector: "[igxDateTimeEditor]", inputs: ["locale", "minValue", "maxValue", "spinLoop", "displayFormat", "igxDateTimeEditor", "value", "defaultFormatType", "spinDelta"], outputs: ["valueChange", "validationFailed"], exportAs: ["igxDateTimeEditor"] }, { kind: "component", type: IgxDialogComponent, selector: "igx-dialog", inputs: ["id", "isModal", "closeOnEscape", "focusTrap", "title", "message", "leftButtonLabel", "leftButtonType", "leftButtonRipple", "rightButtonLabel", "rightButtonType", "rightButtonRipple", "closeOnOutsideSelect", "positionSettings", "isOpen", "role", "titleId"], outputs: ["opening", "opened", "closing", "closed", "leftButtonSelect", "rightButtonSelect", "isOpenChange"] }, { kind: "directive", type: IgxDragIgnoreDirective, selector: "[igxDragIgnore]" }, { kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy", "role"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "directive", type: IgxIconButtonDirective, selector: "[igxIconButton]", inputs: ["igxIconButton"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxInputDirective, selector: "[igxInput]", inputs: ["value", "disabled", "required"], exportAs: ["igxInput"] }, { kind: "component", type: IgxInputGroupComponent, selector: "igx-input-group", inputs: ["resourceStrings", "suppressInputAutofocus", "type", "theme"] }, { kind: "component", type: IgxPickerClearComponent, selector: "igx-picker-clear" }, { kind: "component", type: IgxPickerToggleComponent, selector: "igx-picker-toggle", outputs: ["clicked"] }, { kind: "directive", type: IgxPrefixDirective, selector: "[igxPrefix],[igxStart],igx-prefix" }, { kind: "component", type: IgxSelectComponent, selector: "igx-select", inputs: ["placeholder", "disabled", "overlaySettings", "value", "type"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxSelectItemComponent, selector: "igx-select-item", inputs: ["text"] }, { kind: "component", type: IgxTimePickerComponent, selector: "igx-time-picker", inputs: ["id", "displayFormat", "inputFormat", "mode", "minValue", "maxValue", "spinLoop", "formatter", "readOnly", "value", "resourceStrings", "okButtonLabel", "cancelButtonLabel", "itemsDelta"], outputs: ["selected", "valueChange", "validationFailed"] }, { kind: "directive", type: IgxTooltipDirective, selector: "[igxTooltip]", inputs: ["context", "id", "role"], exportAs: ["tooltip"] }, { kind: "directive", type: IgxTooltipTargetDirective, selector: "[igxTooltipTarget]", inputs: ["showDelay", "hideDelay", "hasArrow", "sticky", "closeButtonTemplate", "positionSettings", "tooltipDisabled", "showTriggers", "hideTriggers", "igxTooltipTarget", "tooltip"], outputs: ["tooltipShow", "tooltipHide"], exportAs: ["tooltipTarget"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: IgxDateFormatterPipe, name: "date" }, { kind: "pipe", type: IgxFieldFormatterPipe, name: "fieldFormatter" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
1892
1892
|
}
|
|
1893
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
1893
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderTreeComponent, decorators: [{
|
|
1894
1894
|
type: Component,
|
|
1895
1895
|
args: [{ selector: 'igx-query-builder-tree', host: { 'class': 'igx-query-builder-tree' }, imports: [
|
|
1896
1896
|
IgxDateFormatterPipe,
|
|
@@ -2029,10 +2029,10 @@ class IgxQueryBuilderSearchValueTemplateDirective {
|
|
|
2029
2029
|
static ngTemplateContextGuard(_directive, context) {
|
|
2030
2030
|
return true;
|
|
2031
2031
|
}
|
|
2032
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2033
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.
|
|
2032
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderSearchValueTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2033
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: IgxQueryBuilderSearchValueTemplateDirective, isStandalone: true, selector: "[igxQueryBuilderSearchValue]", ngImport: i0 }); }
|
|
2034
2034
|
}
|
|
2035
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2035
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderSearchValueTemplateDirective, decorators: [{
|
|
2036
2036
|
type: Directive,
|
|
2037
2037
|
args: [{
|
|
2038
2038
|
selector: '[igxQueryBuilderSearchValue]',
|
|
@@ -2318,10 +2318,10 @@ class IgxQueryBuilderComponent {
|
|
|
2318
2318
|
family: 'material',
|
|
2319
2319
|
});
|
|
2320
2320
|
}
|
|
2321
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2322
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxQueryBuilderComponent, isStandalone: true, selector: "igx-query-builder", inputs: { showEntityChangeDialog: ["showEntityChangeDialog", "showEntityChangeDialog", booleanAttribute], entities: "entities", fields: "fields", expressionTree: "expressionTree", locale: "locale", resourceStrings: "resourceStrings", disableEntityChange: "disableEntityChange", searchValueTemplate: "searchValueTemplate", disableReturnFieldsChange: "disableReturnFieldsChange" }, outputs: { expressionTreeChange: "expressionTreeChange" }, host: { properties: { "class.igx-query-builder": "this.cssClass", "style.display": "this.display" } }, queries: [{ propertyName: "searchValueTemplateDirective", first: true, predicate: IgxQueryBuilderSearchValueTemplateDirective, descendants: true }, { propertyName: "queryBuilderHeaderCollection", predicate: IgxQueryBuilderHeaderComponent }], viewQueries: [{ propertyName: "queryTree", first: true, predicate: IgxQueryBuilderTreeComponent, descendants: true }], ngImport: i0, template: "<ng-content select=\"igx-query-builder-header,igc-query-builder-header\"></ng-content>\n\n<igx-query-builder-tree\n [entities]=\"this.entities\"\n [expressionTree]=\"this.expressionTree\"\n [locale]=\"this.locale\"\n [resourceStrings]=\"this.resourceStrings\"\n [queryBuilder]=\"this\"\n (expressionTreeChange)=\"onExpressionTreeChange($event)\"\n [searchValueTemplate]=\"searchValueTemplate\">\n</igx-query-builder-tree>\n", styles: ["@layer ig.base{.igx-query-builder{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--query-builder-outer-padding: 1.5rem;--_tree-scrollbar-gutter: 1rem;width:auto;min-width:41.25rem;background-color:var(--background);border-radius:var(--border-radius);box-shadow:var(--elevation);overflow:hidden}.igx-query-builder:has(:not(igx-query-builder-header)){padding-block-start:var(--query-builder-outer-padding)}.igx-query-builder:has(:not(igx-query-builder-header)) .igx-query-builder-tree--level-0{padding-block:0 var(--query-builder-outer-padding)}.igx-query-builder:has(igx-query-builder-header){padding-block-start:0}.igx-query-builder .igx-chip__ghost{position:relative}.igx-query-builder__header{display:flex;align-items:center;background-color:var(--header-background);color:var(--header-foreground);-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:var(--border-radius) var(--border-radius) 0 0;margin-bottom:0;border-block-end:.0625rem solid var(--header-border);padding-inline:var(--query-builder-outer-padding);padding-block:var(--query-builder-outer-padding) 1rem}.igx-query-builder__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom)}.igx-query-builder__title:empty{display:none}.igx-query-builder__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);color:var(--label-foreground)}.igx-query-builder__main{display:grid;gap:1rem}.igx-query-builder__root{display:flex;flex-direction:column;flex-grow:1}.igx-query-builder__root>*{flex-grow:1}.igx-query-builder__root-actions{display:flex;gap:.5rem;padding-bottom:1rem}.igx-query-builder__outlet igx-select-item{--ig-icon-size: 1.125rem}.igx-query-builder--inline{display:flex;flex-direction:column;width:100%;max-width:100%;height:inherit;max-height:inherit;min-width:30rem;box-shadow:none}.igx-query-builder--inline .igx-query-builder__main{min-height:initial;max-height:initial;flex-grow:1}.igx-filter-tree{display:flex;width:100%}.igx-filter-tree .igx-filter-tree{margin-block:.5rem}.igx-filter-tree__subquery{max-width:60rem}.igx-filter-tree__subquery:has(>.igx-filter-tree__inputs){background:var(--subquery-header-background);border:.0625rem solid var(--subquery-border-color);border-radius:var(--subquery-border-radius)}.igx-filter-tree__subquery:has(>.igx-query-builder-tree[style=\"display: none;\"]){display:none}.igx-filter-tree__subquery>.igx-filter-tree__inputs{padding:.75rem;border-radius:inherit}.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-input-group,.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-date-picker,.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-time-picker{flex-grow:1}.igx-filter-tree__subquery .igx-filter-tree__buttons{margin-block-start:.5rem}.igx-filter-tree__subquery .igx-query-builder-tree{border-block-start:.0625rem dashed var(--separator-color);padding:.75rem}.igx-filter-tree__subquery:empty{display:none}.igx-filter-tree__section{display:flex;flex-direction:column;gap:.5rem}.igx-filter-tree__section>.igx-filter-tree{margin-block:0}.igx-filter-tree__line{width:.125rem;background-color:#fff;margin-inline-end:.375rem;outline-style:none}.igx-filter-tree__line--and{background:var(--color-expression-group-and)}.igx-filter-tree__line--or{background:var(--color-expression-group-or)}.igx-filter-tree__button--and[igxButton=flat]{--ig-flat-button-foreground: var(--color-expression-group-and);--ig-flat-button-focus-visible-foreground: var(--color-expression-group-and);--ig-flat-button-icon-color: var(--color-expression-group-and);--ig-flat-button-focus-foreground: var(--color-expression-group-and);--ig-flat-button-hover-foreground: var(--color-expression-group-and);--ig-flat-button-icon-color-hover: var(--color-expression-group-and);--ig-flat-button-focus-hover-foreground: var(--color-expression-group-and);--ig-flat-button-active-foreground: var(--color-expression-group-and)}.igx-filter-tree__button--or[igxButton=flat]{--ig-flat-button-foreground: var(--color-expression-group-or);--ig-flat-button-focus-visible-foreground: var(--color-expression-group-or);--ig-flat-button-icon-color: var(--color-expression-group-or);--ig-flat-button-focus-foreground: var(--color-expression-group-or);--ig-flat-button-hover-foreground: var(--color-expression-group-or);--ig-flat-button-icon-color-hover: var(--color-expression-group-or);--ig-flat-button-focus-hover-foreground: var(--color-expression-group-or);--ig-flat-button-active-foreground: var(--color-expression-group-or)}.igx-filter-tree__expressions{display:flex;flex-direction:column;align-items:flex-start;flex-grow:1;gap:.5rem}.igx-filter-tree__expression-context-menu{display:flex;width:100%}.igx-filter-tree__expression-context-menu [igxbutton=flat]{--ig-size: 1;border:none;min-width:auto}.igx-filter-tree__expression-section{display:flex;flex-direction:column;width:calc(100% - 1rem);gap:.5rem;margin-inline-start:1rem}.igx-filter-tree__expression-section:empty{display:none}.igx-filter-tree__expression-item{display:flex;align-items:center;width:100%;gap:.5rem;position:relative}.igx-filter-tree__expression-item igx-chip{--ig-size: 3}.igx-filter-tree__expression-item>igx-chip .igx-filter-tree__expression-column{padding-inline:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.1875rem,-1 * .1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-filter-tree__expression-item>igx-chip .igx-filter-tree__expression-condition{padding-inline-start:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.1875rem,-1 * .1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-filter-tree__expression-item>igx-chip igx-prefix{display:flex}.igx-filter-tree__expression-item>igx-chip .igx-chip__end{gap:max(var(--is-large, 1)*max(.5rem,-1 * .5rem),var(--is-medium, 1)*max(.375rem,-1 * .375rem),var(--is-small, 1)*max(.1875rem,-1 * .1875rem))}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);--ig-body-2-text-transform: unset;padding-inline:2rem;background:#0000;border-width:.0625rem;border-style:dashed}.igx-filter-tree__expression-item-keyboard-ghost .igx-chip__item,.igx-filter-tree__expression-item-keyboard-ghost .igx-chip:hover .igx-chip__item{box-shadow:var(--ghost-shadow);background:var(--ghost-background);color:var(--focus-text-color)}.igx-filter-tree__expression-column{padding:0 .5rem}.igx-filter-tree__expression-actions,.igx-filter-tree__expression-actions span{display:inline-flex}.igx-filter-tree__buttons{--ig-size: 1;display:flex;align-items:center;gap:.5rem}.igx-filter-tree__buttons [igxbutton=flat]{padding-block:0;border:none}.igx-filter-tree__inputs{--ig-size: 1;display:flex;align-items:flex-end;gap:1rem;width:100%;border-radius:inherit}.igx-filter-tree__inputs:empty{display:none}.igx-filter-tree__inputs-field{display:flex;flex-direction:column;gap:.25rem;max-width:15.625rem;width:100%}.igx-filter-tree__inputs-actions{--ig-size: 2;display:flex;gap:.5rem;align-items:center;width:auto;align-self:center}.igx-filter-tree__inputs-actions [igxIconButton]{transition:none}.igx-filter-tree__details-button{margin-inline-start:auto}.igx-query-builder-tree{background:var(--background)}.igx-query-builder-tree .igx-query-builder-tree{border-radius:var(--subquery-border-radius)}.igx-query-builder-tree--level-0{display:block;width:100%;padding-inline:var(--query-builder-outer-padding)}.igx-query-builder-tree--level-0>.igx-query-builder__main{gap:1rem}.igx-query-builder-tree--level-0>.igx-query-builder__main>.igx-filter-tree__section{scrollbar-width:thin;max-height:35.625rem;overflow-y:auto;overflow-x:hidden;padding-inline-end:var(--_tree-scrollbar-gutter)}.igx-query-builder-dialog{display:flex;flex-direction:column;gap:1rem;max-width:19.375rem}.igx-query-builder-dialog>*{margin:0!important}.igx-advanced-filter{background:var(--background);box-shadow:var(--ig-elevation-24);border-radius:var(--border-radius)}.igx-advanced-filter igx-query-builder{box-shadow:none;border:none;border-radius:inherit}.igx-advanced-filter igx-query-builder-header{cursor:grab}}@layer ig.material{@container style(--ig-theme: material){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0}}}@layer ig.material{@container style(--ig-theme: material){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-and) h s l / .16);--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--background: transparent}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-or) h s l / .16);--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--background: transparent}.igx-filter-tree__expression-actions{gap:1rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-condition{opacity:.6}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-query-builder{--query-builder-outer-padding: 1rem}.igx-query-builder:has(igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:1rem var(--query-builder-outer-padding)}.igx-query-builder__title{font-family:var(--ig-h5-font-family, var(--ig-font-family));font-size:var(--ig-h5-font-size);font-weight:var(--ig-h5-font-weight);font-style:var(--ig-h5-font-style);line-height:var(--ig-h5-line-height);letter-spacing:var(--ig-h5-letter-spacing);text-transform:var(--ig-h5-text-transform);margin-top:var(--ig-h5-margin-top);margin-bottom:var(--ig-h5-margin-bottom);margin-block:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-advanced-filter .igx-excel-filter__secondary-footer{padding:1rem;border-top:.0625rem solid var(--header-border)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: transparent;--focus-visible-background: transparent;--focus-background: transparent;--active-background: transparent;--hover-background: transparent;--background: transparent;--shadow-color: hsl(from var(--color-expression-group-and) h s l / .5);--icon-color-hover: hsl(from var(--color-expression-group-and) h s 34% / 1);--focus-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--hover-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--active-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1)}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: transparent;--focus-visible-background: transparent;--focus-background: transparent;--active-background: transparent;--hover-background: transparent;--background: transparent;--shadow-color: hsl(from var(--color-expression-group-or) h s l / .5);--icon-color-hover: hsl(from var(--color-expression-group-or) h s 14% / 1);--focus-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--hover-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--active-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1)}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 1}.igx-filter-tree__expression-context-menu{--ig-button-text-transform: capitalize}.igx-filter-tree__inputs{--ig-size: 2}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0 var(--query-builder-outer-padding)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-filter-tree__button--and[igxButton=flat]{--background: transparent;--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--focus-visible-background: transparent;--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08)}.igx-filter-tree__button--or[igxButton=flat]{--background: transparent;--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--focus-visible-background: transparent;--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08)}.igx-filter-tree__expression-actions{gap:1rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-condition{opacity:.6}.igx-filter-tree__inputs{--ig-size: 1}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-advanced-filter{box-shadow:var(--ig-elevation-24)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-and) h s l / .16);--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--background: transparent}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-or) h s l / .16);--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--background: transparent}.igx-filter-tree__expression-actions{gap:.5rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-item-keyboard-ghost .igx-chip:hover .igx-chip__item{border-color:var(--border-color)}.igx-filter-tree__expression-condition{opacity:.8}.igx-filter-tree__inputs{--ig-size: 2}.igx-filter-tree__expression-item-keyboard-ghost igx-chip:hover .igx-chip__item{border-color:var(--border-color)}}}@layer ig.material{@container style(--ig-theme: material) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: light){.igx-query-builder--sortable .igx-query-builder__icons .sort-icon{opacity:.75}.igx-query-builder--sortable .igx-query-builder__icons .sort-icon:hover{opacity:1}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.material{@container style(--ig-theme: material) and style(--ig-theme-variant: dark){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: dark){.igx-filter-tree__button--and[igxButton=flat]{--icon-color-hover: hsl(from var(--color-expression-group-and) h s 78% / 1);--focus-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--hover-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--active-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1)}.igx-filter-tree__button--or[igxButton=flat]{--icon-color-hover: hsl(from var(--color-expression-group-or) h s 47% / 1);--focus-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--hover-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--active-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1)}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: dark){.igx-filter-tree__button--and[igxButton=flat],.igx-filter-tree__button--or[igxButton=flat]{--background: transparent;--focus-hover-background: var(--ig-gray-200);--focus-visible-background: transparent;--focus-background: transparent;--active-background: var(--ig-gray-200);--hover-background: var(--ig-gray-200)}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: dark){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}\n"], dependencies: [{ kind: "component", type: IgxQueryBuilderTreeComponent, selector: "igx-query-builder-tree", inputs: ["entities", "queryBuilder", "searchValueTemplate", "parentExpression", "fields", "expressionTree", "locale", "resourceStrings", "expectedReturnField"], outputs: ["expressionTreeChange", "inEditModeChange"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2321
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2322
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.2.0", type: IgxQueryBuilderComponent, isStandalone: true, selector: "igx-query-builder", inputs: { showEntityChangeDialog: ["showEntityChangeDialog", "showEntityChangeDialog", booleanAttribute], entities: "entities", fields: "fields", expressionTree: "expressionTree", locale: "locale", resourceStrings: "resourceStrings", disableEntityChange: "disableEntityChange", searchValueTemplate: "searchValueTemplate", disableReturnFieldsChange: "disableReturnFieldsChange" }, outputs: { expressionTreeChange: "expressionTreeChange" }, host: { properties: { "class.igx-query-builder": "this.cssClass", "style.display": "this.display" } }, queries: [{ propertyName: "searchValueTemplateDirective", first: true, predicate: IgxQueryBuilderSearchValueTemplateDirective, descendants: true }, { propertyName: "queryBuilderHeaderCollection", predicate: IgxQueryBuilderHeaderComponent }], viewQueries: [{ propertyName: "queryTree", first: true, predicate: IgxQueryBuilderTreeComponent, descendants: true }], ngImport: i0, template: "<ng-content select=\"igx-query-builder-header,igc-query-builder-header\"></ng-content>\n\n<igx-query-builder-tree\n [entities]=\"this.entities\"\n [expressionTree]=\"this.expressionTree\"\n [locale]=\"this.locale\"\n [resourceStrings]=\"this.resourceStrings\"\n [queryBuilder]=\"this\"\n (expressionTreeChange)=\"onExpressionTreeChange($event)\"\n [searchValueTemplate]=\"searchValueTemplate\">\n</igx-query-builder-tree>\n", styles: ["@layer ig.base{.igx-query-builder{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--query-builder-outer-padding: 1.5rem;--_tree-scrollbar-gutter: 1rem;width:auto;min-width:41.25rem;background-color:var(--background);border-radius:var(--border-radius);box-shadow:var(--elevation);overflow:hidden}.igx-query-builder:has(:not(igx-query-builder-header)){padding-block-start:var(--query-builder-outer-padding)}.igx-query-builder:has(:not(igx-query-builder-header)) .igx-query-builder-tree--level-0{padding-block:0 var(--query-builder-outer-padding)}.igx-query-builder:has(igx-query-builder-header){padding-block-start:0}.igx-query-builder .igx-chip__ghost{position:relative}.igx-query-builder__header{display:flex;align-items:center;background-color:var(--header-background);color:var(--header-foreground);-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:var(--border-radius) var(--border-radius) 0 0;margin-bottom:0;border-block-end:.0625rem solid var(--header-border);padding-inline:var(--query-builder-outer-padding);padding-block:var(--query-builder-outer-padding) 1rem}.igx-query-builder__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom)}.igx-query-builder__title:empty{display:none}.igx-query-builder__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);color:var(--label-foreground)}.igx-query-builder__main{display:grid;gap:1rem}.igx-query-builder__root{display:flex;flex-direction:column;flex-grow:1}.igx-query-builder__root>*{flex-grow:1}.igx-query-builder__root-actions{display:flex;gap:.5rem;padding-bottom:1rem}.igx-query-builder__outlet igx-select-item{--ig-icon-size: 1.125rem}.igx-query-builder--inline{display:flex;flex-direction:column;width:100%;max-width:100%;height:inherit;max-height:inherit;min-width:30rem;box-shadow:none}.igx-query-builder--inline .igx-query-builder__main{min-height:initial;max-height:initial;flex-grow:1}.igx-filter-tree{display:flex;width:100%}.igx-filter-tree .igx-filter-tree{margin-block:.5rem}.igx-filter-tree__subquery{max-width:60rem}.igx-filter-tree__subquery:has(>.igx-filter-tree__inputs){background:var(--subquery-header-background);border:.0625rem solid var(--subquery-border-color);border-radius:var(--subquery-border-radius)}.igx-filter-tree__subquery:has(>.igx-query-builder-tree[style=\"display: none;\"]){display:none}.igx-filter-tree__subquery>.igx-filter-tree__inputs{padding:.75rem;border-radius:inherit}.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-input-group,.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-date-picker,.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-time-picker{flex-grow:1}.igx-filter-tree__subquery .igx-filter-tree__buttons{margin-block-start:.5rem}.igx-filter-tree__subquery .igx-query-builder-tree{border-block-start:.0625rem dashed var(--separator-color);padding:.75rem}.igx-filter-tree__subquery:empty{display:none}.igx-filter-tree__section{display:flex;flex-direction:column;gap:.5rem}.igx-filter-tree__section>.igx-filter-tree{margin-block:0}.igx-filter-tree__line{width:.125rem;background-color:#fff;margin-inline-end:.375rem;outline-style:none}.igx-filter-tree__line--and{background:var(--color-expression-group-and)}.igx-filter-tree__line--or{background:var(--color-expression-group-or)}.igx-filter-tree__button--and[igxButton=flat]{--ig-flat-button-foreground: var(--color-expression-group-and);--ig-flat-button-focus-visible-foreground: var(--color-expression-group-and);--ig-flat-button-icon-color: var(--color-expression-group-and);--ig-flat-button-focus-foreground: var(--color-expression-group-and);--ig-flat-button-hover-foreground: var(--color-expression-group-and);--ig-flat-button-icon-color-hover: var(--color-expression-group-and);--ig-flat-button-focus-hover-foreground: var(--color-expression-group-and);--ig-flat-button-active-foreground: var(--color-expression-group-and)}.igx-filter-tree__button--or[igxButton=flat]{--ig-flat-button-foreground: var(--color-expression-group-or);--ig-flat-button-focus-visible-foreground: var(--color-expression-group-or);--ig-flat-button-icon-color: var(--color-expression-group-or);--ig-flat-button-focus-foreground: var(--color-expression-group-or);--ig-flat-button-hover-foreground: var(--color-expression-group-or);--ig-flat-button-icon-color-hover: var(--color-expression-group-or);--ig-flat-button-focus-hover-foreground: var(--color-expression-group-or);--ig-flat-button-active-foreground: var(--color-expression-group-or)}.igx-filter-tree__expressions{display:flex;flex-direction:column;align-items:flex-start;flex-grow:1;gap:.5rem}.igx-filter-tree__expression-context-menu{display:flex;width:100%}.igx-filter-tree__expression-context-menu [igxbutton=flat]{--ig-size: 1;border:none;min-width:auto}.igx-filter-tree__expression-section{display:flex;flex-direction:column;width:calc(100% - 1rem);gap:.5rem;margin-inline-start:1rem}.igx-filter-tree__expression-section:empty{display:none}.igx-filter-tree__expression-item{display:flex;align-items:center;width:100%;gap:.5rem;position:relative}.igx-filter-tree__expression-item igx-chip{--ig-size: 3}.igx-filter-tree__expression-item>igx-chip .igx-filter-tree__expression-column{padding-inline:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.1875rem,-1 * .1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-filter-tree__expression-item>igx-chip .igx-filter-tree__expression-condition{padding-inline-start:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.1875rem,-1 * .1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-filter-tree__expression-item>igx-chip igx-prefix{display:flex}.igx-filter-tree__expression-item>igx-chip .igx-chip__end{gap:max(var(--is-large, 1)*max(.5rem,-1 * .5rem),var(--is-medium, 1)*max(.375rem,-1 * .375rem),var(--is-small, 1)*max(.1875rem,-1 * .1875rem))}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);--ig-body-2-text-transform: unset;padding-inline:2rem;background:#0000;border-width:.0625rem;border-style:dashed}.igx-filter-tree__expression-item-keyboard-ghost .igx-chip__item,.igx-filter-tree__expression-item-keyboard-ghost .igx-chip:hover .igx-chip__item{box-shadow:var(--ghost-shadow);background:var(--ghost-background);color:var(--focus-text-color)}.igx-filter-tree__expression-column{padding:0 .5rem}.igx-filter-tree__expression-actions,.igx-filter-tree__expression-actions span{display:inline-flex}.igx-filter-tree__buttons{--ig-size: 1;display:flex;align-items:center;gap:.5rem}.igx-filter-tree__buttons [igxbutton=flat]{padding-block:0;border:none}.igx-filter-tree__inputs{--ig-size: 1;display:flex;align-items:flex-end;gap:1rem;width:100%;border-radius:inherit}.igx-filter-tree__inputs:empty{display:none}.igx-filter-tree__inputs-field{display:flex;flex-direction:column;gap:.25rem;max-width:15.625rem;width:100%}.igx-filter-tree__inputs-actions{--ig-size: 2;display:flex;gap:.5rem;align-items:center;width:auto;align-self:center}.igx-filter-tree__inputs-actions [igxIconButton]{transition:none}.igx-filter-tree__details-button{margin-inline-start:auto}.igx-query-builder-tree{background:var(--background)}.igx-query-builder-tree .igx-query-builder-tree{border-radius:var(--subquery-border-radius)}.igx-query-builder-tree--level-0{display:block;width:100%;padding-inline:var(--query-builder-outer-padding)}.igx-query-builder-tree--level-0>.igx-query-builder__main{gap:1rem}.igx-query-builder-tree--level-0>.igx-query-builder__main>.igx-filter-tree__section{scrollbar-width:thin;max-height:35.625rem;overflow-y:auto;overflow-x:hidden;padding-inline-end:var(--_tree-scrollbar-gutter)}.igx-query-builder-dialog{display:flex;flex-direction:column;gap:1rem;max-width:19.375rem}.igx-query-builder-dialog>*{margin:0!important}.igx-advanced-filter{background:var(--background);box-shadow:var(--ig-elevation-24);border-radius:var(--border-radius)}.igx-advanced-filter igx-query-builder{box-shadow:none;border:none;border-radius:inherit}.igx-advanced-filter igx-query-builder-header{cursor:grab}}@layer ig.material{@container style(--ig-theme: material){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0}}}@layer ig.material{@container style(--ig-theme: material){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-and) h s l / .16);--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--background: transparent}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-or) h s l / .16);--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--background: transparent}.igx-filter-tree__expression-actions{gap:1rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-condition{opacity:.6}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-query-builder{--query-builder-outer-padding: 1rem}.igx-query-builder:has(igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:1rem var(--query-builder-outer-padding)}.igx-query-builder__title{font-family:var(--ig-h5-font-family, var(--ig-font-family));font-size:var(--ig-h5-font-size);font-weight:var(--ig-h5-font-weight);font-style:var(--ig-h5-font-style);line-height:var(--ig-h5-line-height);letter-spacing:var(--ig-h5-letter-spacing);text-transform:var(--ig-h5-text-transform);margin-top:var(--ig-h5-margin-top);margin-bottom:var(--ig-h5-margin-bottom);margin-block:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-advanced-filter .igx-excel-filter__secondary-footer{padding:1rem;border-top:.0625rem solid var(--header-border)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: transparent;--focus-visible-background: transparent;--focus-background: transparent;--active-background: transparent;--hover-background: transparent;--background: transparent;--shadow-color: hsl(from var(--color-expression-group-and) h s l / .5);--icon-color-hover: hsl(from var(--color-expression-group-and) h s 34% / 1);--focus-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--hover-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--active-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1)}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: transparent;--focus-visible-background: transparent;--focus-background: transparent;--active-background: transparent;--hover-background: transparent;--background: transparent;--shadow-color: hsl(from var(--color-expression-group-or) h s l / .5);--icon-color-hover: hsl(from var(--color-expression-group-or) h s 14% / 1);--focus-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--hover-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--active-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1)}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 1}.igx-filter-tree__expression-context-menu{--ig-button-text-transform: capitalize}.igx-filter-tree__inputs{--ig-size: 2}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0 var(--query-builder-outer-padding)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-filter-tree__button--and[igxButton=flat]{--background: transparent;--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--focus-visible-background: transparent;--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08)}.igx-filter-tree__button--or[igxButton=flat]{--background: transparent;--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--focus-visible-background: transparent;--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08)}.igx-filter-tree__expression-actions{gap:1rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-condition{opacity:.6}.igx-filter-tree__inputs{--ig-size: 1}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-advanced-filter{box-shadow:var(--ig-elevation-24)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-and) h s l / .16);--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--background: transparent}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-or) h s l / .16);--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--background: transparent}.igx-filter-tree__expression-actions{gap:.5rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-item-keyboard-ghost .igx-chip:hover .igx-chip__item{border-color:var(--border-color)}.igx-filter-tree__expression-condition{opacity:.8}.igx-filter-tree__inputs{--ig-size: 2}.igx-filter-tree__expression-item-keyboard-ghost igx-chip:hover .igx-chip__item{border-color:var(--border-color)}}}@layer ig.material{@container style(--ig-theme: material) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: light){.igx-query-builder--sortable .igx-query-builder__icons .sort-icon{opacity:.75}.igx-query-builder--sortable .igx-query-builder__icons .sort-icon:hover{opacity:1}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.material{@container style(--ig-theme: material) and style(--ig-theme-variant: dark){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: dark){.igx-filter-tree__button--and[igxButton=flat]{--icon-color-hover: hsl(from var(--color-expression-group-and) h s 78% / 1);--focus-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--hover-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--active-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1)}.igx-filter-tree__button--or[igxButton=flat]{--icon-color-hover: hsl(from var(--color-expression-group-or) h s 47% / 1);--focus-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--hover-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--active-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1)}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: dark){.igx-filter-tree__button--and[igxButton=flat],.igx-filter-tree__button--or[igxButton=flat]{--background: transparent;--focus-hover-background: var(--ig-gray-200);--focus-visible-background: transparent;--focus-background: transparent;--active-background: var(--ig-gray-200);--hover-background: var(--ig-gray-200)}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: dark){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}\n"], dependencies: [{ kind: "component", type: IgxQueryBuilderTreeComponent, selector: "igx-query-builder-tree", inputs: ["entities", "queryBuilder", "searchValueTemplate", "parentExpression", "fields", "expressionTree", "locale", "resourceStrings", "expectedReturnField"], outputs: ["expressionTreeChange", "inEditModeChange"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2323
2323
|
}
|
|
2324
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2324
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderComponent, decorators: [{
|
|
2325
2325
|
type: Component,
|
|
2326
2326
|
args: [{ selector: 'igx-query-builder', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxQueryBuilderTreeComponent], template: "<ng-content select=\"igx-query-builder-header,igc-query-builder-header\"></ng-content>\n\n<igx-query-builder-tree\n [entities]=\"this.entities\"\n [expressionTree]=\"this.expressionTree\"\n [locale]=\"this.locale\"\n [resourceStrings]=\"this.resourceStrings\"\n [queryBuilder]=\"this\"\n (expressionTreeChange)=\"onExpressionTreeChange($event)\"\n [searchValueTemplate]=\"searchValueTemplate\">\n</igx-query-builder-tree>\n", styles: ["@layer ig.base{.igx-query-builder{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--query-builder-outer-padding: 1.5rem;--_tree-scrollbar-gutter: 1rem;width:auto;min-width:41.25rem;background-color:var(--background);border-radius:var(--border-radius);box-shadow:var(--elevation);overflow:hidden}.igx-query-builder:has(:not(igx-query-builder-header)){padding-block-start:var(--query-builder-outer-padding)}.igx-query-builder:has(:not(igx-query-builder-header)) .igx-query-builder-tree--level-0{padding-block:0 var(--query-builder-outer-padding)}.igx-query-builder:has(igx-query-builder-header){padding-block-start:0}.igx-query-builder .igx-chip__ghost{position:relative}.igx-query-builder__header{display:flex;align-items:center;background-color:var(--header-background);color:var(--header-foreground);-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:var(--border-radius) var(--border-radius) 0 0;margin-bottom:0;border-block-end:.0625rem solid var(--header-border);padding-inline:var(--query-builder-outer-padding);padding-block:var(--query-builder-outer-padding) 1rem}.igx-query-builder__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom)}.igx-query-builder__title:empty{display:none}.igx-query-builder__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);color:var(--label-foreground)}.igx-query-builder__main{display:grid;gap:1rem}.igx-query-builder__root{display:flex;flex-direction:column;flex-grow:1}.igx-query-builder__root>*{flex-grow:1}.igx-query-builder__root-actions{display:flex;gap:.5rem;padding-bottom:1rem}.igx-query-builder__outlet igx-select-item{--ig-icon-size: 1.125rem}.igx-query-builder--inline{display:flex;flex-direction:column;width:100%;max-width:100%;height:inherit;max-height:inherit;min-width:30rem;box-shadow:none}.igx-query-builder--inline .igx-query-builder__main{min-height:initial;max-height:initial;flex-grow:1}.igx-filter-tree{display:flex;width:100%}.igx-filter-tree .igx-filter-tree{margin-block:.5rem}.igx-filter-tree__subquery{max-width:60rem}.igx-filter-tree__subquery:has(>.igx-filter-tree__inputs){background:var(--subquery-header-background);border:.0625rem solid var(--subquery-border-color);border-radius:var(--subquery-border-radius)}.igx-filter-tree__subquery:has(>.igx-query-builder-tree[style=\"display: none;\"]){display:none}.igx-filter-tree__subquery>.igx-filter-tree__inputs{padding:.75rem;border-radius:inherit}.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-input-group,.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-date-picker,.igx-filter-tree__subquery>.igx-filter-tree__inputs>igx-time-picker{flex-grow:1}.igx-filter-tree__subquery .igx-filter-tree__buttons{margin-block-start:.5rem}.igx-filter-tree__subquery .igx-query-builder-tree{border-block-start:.0625rem dashed var(--separator-color);padding:.75rem}.igx-filter-tree__subquery:empty{display:none}.igx-filter-tree__section{display:flex;flex-direction:column;gap:.5rem}.igx-filter-tree__section>.igx-filter-tree{margin-block:0}.igx-filter-tree__line{width:.125rem;background-color:#fff;margin-inline-end:.375rem;outline-style:none}.igx-filter-tree__line--and{background:var(--color-expression-group-and)}.igx-filter-tree__line--or{background:var(--color-expression-group-or)}.igx-filter-tree__button--and[igxButton=flat]{--ig-flat-button-foreground: var(--color-expression-group-and);--ig-flat-button-focus-visible-foreground: var(--color-expression-group-and);--ig-flat-button-icon-color: var(--color-expression-group-and);--ig-flat-button-focus-foreground: var(--color-expression-group-and);--ig-flat-button-hover-foreground: var(--color-expression-group-and);--ig-flat-button-icon-color-hover: var(--color-expression-group-and);--ig-flat-button-focus-hover-foreground: var(--color-expression-group-and);--ig-flat-button-active-foreground: var(--color-expression-group-and)}.igx-filter-tree__button--or[igxButton=flat]{--ig-flat-button-foreground: var(--color-expression-group-or);--ig-flat-button-focus-visible-foreground: var(--color-expression-group-or);--ig-flat-button-icon-color: var(--color-expression-group-or);--ig-flat-button-focus-foreground: var(--color-expression-group-or);--ig-flat-button-hover-foreground: var(--color-expression-group-or);--ig-flat-button-icon-color-hover: var(--color-expression-group-or);--ig-flat-button-focus-hover-foreground: var(--color-expression-group-or);--ig-flat-button-active-foreground: var(--color-expression-group-or)}.igx-filter-tree__expressions{display:flex;flex-direction:column;align-items:flex-start;flex-grow:1;gap:.5rem}.igx-filter-tree__expression-context-menu{display:flex;width:100%}.igx-filter-tree__expression-context-menu [igxbutton=flat]{--ig-size: 1;border:none;min-width:auto}.igx-filter-tree__expression-section{display:flex;flex-direction:column;width:calc(100% - 1rem);gap:.5rem;margin-inline-start:1rem}.igx-filter-tree__expression-section:empty{display:none}.igx-filter-tree__expression-item{display:flex;align-items:center;width:100%;gap:.5rem;position:relative}.igx-filter-tree__expression-item igx-chip{--ig-size: 3}.igx-filter-tree__expression-item>igx-chip .igx-filter-tree__expression-column{padding-inline:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.1875rem,-1 * .1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-filter-tree__expression-item>igx-chip .igx-filter-tree__expression-condition{padding-inline-start:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.1875rem,-1 * .1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-filter-tree__expression-item>igx-chip igx-prefix{display:flex}.igx-filter-tree__expression-item>igx-chip .igx-chip__end{gap:max(var(--is-large, 1)*max(.5rem,-1 * .5rem),var(--is-medium, 1)*max(.375rem,-1 * .375rem),var(--is-small, 1)*max(.1875rem,-1 * .1875rem))}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);--ig-body-2-text-transform: unset;padding-inline:2rem;background:#0000;border-width:.0625rem;border-style:dashed}.igx-filter-tree__expression-item-keyboard-ghost .igx-chip__item,.igx-filter-tree__expression-item-keyboard-ghost .igx-chip:hover .igx-chip__item{box-shadow:var(--ghost-shadow);background:var(--ghost-background);color:var(--focus-text-color)}.igx-filter-tree__expression-column{padding:0 .5rem}.igx-filter-tree__expression-actions,.igx-filter-tree__expression-actions span{display:inline-flex}.igx-filter-tree__buttons{--ig-size: 1;display:flex;align-items:center;gap:.5rem}.igx-filter-tree__buttons [igxbutton=flat]{padding-block:0;border:none}.igx-filter-tree__inputs{--ig-size: 1;display:flex;align-items:flex-end;gap:1rem;width:100%;border-radius:inherit}.igx-filter-tree__inputs:empty{display:none}.igx-filter-tree__inputs-field{display:flex;flex-direction:column;gap:.25rem;max-width:15.625rem;width:100%}.igx-filter-tree__inputs-actions{--ig-size: 2;display:flex;gap:.5rem;align-items:center;width:auto;align-self:center}.igx-filter-tree__inputs-actions [igxIconButton]{transition:none}.igx-filter-tree__details-button{margin-inline-start:auto}.igx-query-builder-tree{background:var(--background)}.igx-query-builder-tree .igx-query-builder-tree{border-radius:var(--subquery-border-radius)}.igx-query-builder-tree--level-0{display:block;width:100%;padding-inline:var(--query-builder-outer-padding)}.igx-query-builder-tree--level-0>.igx-query-builder__main{gap:1rem}.igx-query-builder-tree--level-0>.igx-query-builder__main>.igx-filter-tree__section{scrollbar-width:thin;max-height:35.625rem;overflow-y:auto;overflow-x:hidden;padding-inline-end:var(--_tree-scrollbar-gutter)}.igx-query-builder-dialog{display:flex;flex-direction:column;gap:1rem;max-width:19.375rem}.igx-query-builder-dialog>*{margin:0!important}.igx-advanced-filter{background:var(--background);box-shadow:var(--ig-elevation-24);border-radius:var(--border-radius)}.igx-advanced-filter igx-query-builder{box-shadow:none;border:none;border-radius:inherit}.igx-advanced-filter igx-query-builder-header{cursor:grab}}@layer ig.material{@container style(--ig-theme: material){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0}}}@layer ig.material{@container style(--ig-theme: material){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-and) h s l / .16);--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--background: transparent}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-or) h s l / .16);--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--background: transparent}.igx-filter-tree__expression-actions{gap:1rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-condition{opacity:.6}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-query-builder{--query-builder-outer-padding: 1rem}.igx-query-builder:has(igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:1rem var(--query-builder-outer-padding)}.igx-query-builder__title{font-family:var(--ig-h5-font-family, var(--ig-font-family));font-size:var(--ig-h5-font-size);font-weight:var(--ig-h5-font-weight);font-style:var(--ig-h5-font-style);line-height:var(--ig-h5-line-height);letter-spacing:var(--ig-h5-letter-spacing);text-transform:var(--ig-h5-text-transform);margin-top:var(--ig-h5-margin-top);margin-bottom:var(--ig-h5-margin-bottom);margin-block:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-advanced-filter .igx-excel-filter__secondary-footer{padding:1rem;border-top:.0625rem solid var(--header-border)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: transparent;--focus-visible-background: transparent;--focus-background: transparent;--active-background: transparent;--hover-background: transparent;--background: transparent;--shadow-color: hsl(from var(--color-expression-group-and) h s l / .5);--icon-color-hover: hsl(from var(--color-expression-group-and) h s 34% / 1);--focus-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--hover-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1);--active-foreground: hsl(from var(--color-expression-group-and) h s 34% / 1)}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: transparent;--focus-visible-background: transparent;--focus-background: transparent;--active-background: transparent;--hover-background: transparent;--background: transparent;--shadow-color: hsl(from var(--color-expression-group-or) h s l / .5);--icon-color-hover: hsl(from var(--color-expression-group-or) h s 14% / 1);--focus-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--hover-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1);--active-foreground: hsl(from var(--color-expression-group-or) h s 14% / 1)}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 1}.igx-filter-tree__expression-context-menu{--ig-button-text-transform: capitalize}.igx-filter-tree__inputs{--ig-size: 2}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0 var(--query-builder-outer-padding)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-filter-tree__button--and[igxButton=flat]{--background: transparent;--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--focus-visible-background: transparent;--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08)}.igx-filter-tree__button--or[igxButton=flat]{--background: transparent;--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--focus-visible-background: transparent;--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08)}.igx-filter-tree__expression-actions{gap:1rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-condition{opacity:.6}.igx-filter-tree__inputs{--ig-size: 1}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-advanced-filter{box-shadow:var(--ig-elevation-24)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-query-builder:has(.igx-query-builder-header) .igx-query-builder-tree--level-0{padding-block:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-filter-tree__button--and[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-and) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-and) h s l / .16);--focus-background: hsl(from var(--color-expression-group-and) h s l / .16);--active-background: hsl(from var(--color-expression-group-and) h s l / .16);--hover-background: hsl(from var(--color-expression-group-and) h s l / .08);--background: transparent}.igx-filter-tree__button--or[igxButton=flat]{--focus-hover-background: hsl(from var(--color-expression-group-or) h s l / .24);--focus-visible-background: hsl(from var(--color-expression-group-or) h s l / .16);--focus-background: hsl(from var(--color-expression-group-or) h s l / .16);--active-background: hsl(from var(--color-expression-group-or) h s l / .16);--hover-background: hsl(from var(--color-expression-group-or) h s l / .08);--background: transparent}.igx-filter-tree__expression-actions{gap:.5rem}.igx-filter-tree__expression-actions .igx-icon-button{--ig-size: 2}.igx-filter-tree__expression-item-keyboard-ghost .igx-chip:hover .igx-chip__item{border-color:var(--border-color)}.igx-filter-tree__expression-condition{opacity:.8}.igx-filter-tree__inputs{--ig-size: 2}.igx-filter-tree__expression-item-keyboard-ghost igx-chip:hover .igx-chip__item{border-color:var(--border-color)}}}@layer ig.material{@container style(--ig-theme: material) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: light){.igx-query-builder--sortable .igx-query-builder__icons .sort-icon{opacity:.75}.igx-query-builder--sortable .igx-query-builder__icons .sort-icon:hover{opacity:1}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: light){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-600);border-color:var(--ig-gray-600)}}}@layer ig.material{@container style(--ig-theme: material) and style(--ig-theme-variant: dark){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: dark){.igx-filter-tree__button--and[igxButton=flat]{--icon-color-hover: hsl(from var(--color-expression-group-and) h s 78% / 1);--focus-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--hover-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1);--active-foreground: hsl(from var(--color-expression-group-and) h s 78% / 1)}.igx-filter-tree__button--or[igxButton=flat]{--icon-color-hover: hsl(from var(--color-expression-group-or) h s 47% / 1);--focus-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--hover-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--focus-hover-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1);--active-foreground: hsl(from var(--color-expression-group-or) h s 47% / 1)}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: dark){.igx-filter-tree__button--and[igxButton=flat],.igx-filter-tree__button--or[igxButton=flat]{--background: transparent;--focus-hover-background: var(--ig-gray-200);--focus-visible-background: transparent;--focus-background: transparent;--active-background: var(--ig-gray-200);--hover-background: var(--ig-gray-200)}.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}@layer ig.indigo{@container style(--ig-theme: indigo) and style(--ig-theme-variant: dark){.igx-filter-tree__expression-item-drop-ghost .igx-chip__item{color:var(--ig-gray-900);border-color:var(--ig-gray-300)}}}\n"] }]
|
|
2327
2327
|
}], ctorParameters: () => [], propDecorators: { cssClass: [{
|
|
@@ -2374,11 +2374,11 @@ const IGX_QUERY_BUILDER_DIRECTIVES = [
|
|
|
2374
2374
|
* IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
|
|
2375
2375
|
*/
|
|
2376
2376
|
class IgxQueryBuilderModule {
|
|
2377
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
2378
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.
|
|
2379
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.
|
|
2377
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2378
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderModule, imports: [IgxQueryBuilderComponent, IgxQueryBuilderHeaderComponent, IgxQueryBuilderSearchValueTemplateDirective], exports: [IgxQueryBuilderComponent, IgxQueryBuilderHeaderComponent, IgxQueryBuilderSearchValueTemplateDirective] }); }
|
|
2379
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderModule, imports: [IgxQueryBuilderComponent] }); }
|
|
2380
2380
|
}
|
|
2381
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
2381
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxQueryBuilderModule, decorators: [{
|
|
2382
2382
|
type: NgModule,
|
|
2383
2383
|
args: [{
|
|
2384
2384
|
imports: [
|
|
@@ -236,6 +236,7 @@ class IgxRadioGroupDirective {
|
|
|
236
236
|
* @internal
|
|
237
237
|
*/
|
|
238
238
|
updateValidityOnBlur() {
|
|
239
|
+
this._onTouchedCallback();
|
|
239
240
|
this._radioButtons().forEach((button) => {
|
|
240
241
|
button.focused = false;
|
|
241
242
|
if (button.invalid) {
|
|
@@ -307,11 +308,8 @@ class IgxRadioGroupDirective {
|
|
|
307
308
|
* @internal
|
|
308
309
|
*/
|
|
309
310
|
registerOnTouched(fn) {
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
button.registerOnTouched(fn);
|
|
313
|
-
});
|
|
314
|
-
}
|
|
311
|
+
// Invoked on child blur, as forms register it before the child radio buttons exist.
|
|
312
|
+
this._onTouchedCallback = fn;
|
|
315
313
|
}
|
|
316
314
|
/** @hidden @internal */
|
|
317
315
|
setDisabledState(isDisabled) {
|
|
@@ -372,6 +370,11 @@ class IgxRadioGroupDirective {
|
|
|
372
370
|
* @internal
|
|
373
371
|
*/
|
|
374
372
|
this._onChangeCallback = noop;
|
|
373
|
+
/**
|
|
374
|
+
* @hidden
|
|
375
|
+
* @internal
|
|
376
|
+
*/
|
|
377
|
+
this._onTouchedCallback = noop;
|
|
375
378
|
/**
|
|
376
379
|
* @hidden
|
|
377
380
|
* @internal
|
|
@@ -430,15 +433,17 @@ class IgxRadioGroupDirective {
|
|
|
430
433
|
// The initial value can possibly be set by NgModel and it is possible that
|
|
431
434
|
// the OnInit of the NgModel occurs after the OnInit of this class.
|
|
432
435
|
this._isInitialized.set(true);
|
|
433
|
-
|
|
436
|
+
const control = this.control;
|
|
437
|
+
if (control) {
|
|
434
438
|
// Runs inside an effect, so subscribe once.
|
|
435
|
-
|
|
439
|
+
// Signal Forms also emit on touch, so re-evaluate rather than reset the state set on blur.
|
|
440
|
+
this._statusChanges$ ??= control.statusChanges
|
|
436
441
|
.pipe(takeUntil(this.destroy$))
|
|
437
442
|
.subscribe(() => {
|
|
438
|
-
this.invalid =
|
|
443
|
+
this.invalid = !control.disabled && control.touchedOrDirty && control.invalid;
|
|
439
444
|
});
|
|
440
|
-
if (
|
|
441
|
-
this._required =
|
|
445
|
+
if (control.hasValidators) {
|
|
446
|
+
this._required = control.required;
|
|
442
447
|
}
|
|
443
448
|
// Buttons registered after `setDisabledState` pick the state up here.
|
|
444
449
|
if (this._disabled) {
|
|
@@ -461,7 +466,6 @@ class IgxRadioGroupDirective {
|
|
|
461
466
|
this._selected = button;
|
|
462
467
|
this.cdr.markForCheck();
|
|
463
468
|
}
|
|
464
|
-
this._setRadioButtonEvents(button);
|
|
465
469
|
});
|
|
466
470
|
}
|
|
467
471
|
/**
|
|
@@ -586,10 +590,10 @@ class IgxRadioGroupDirective {
|
|
|
586
590
|
});
|
|
587
591
|
}
|
|
588
592
|
}
|
|
589
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
590
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.
|
|
593
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
594
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.2.0", type: IgxRadioGroupDirective, isStandalone: true, selector: "[igxRadioGroup],igx-radio-group", inputs: { value: "value", name: "name", required: ["required", "required", booleanAttribute], selected: "selected", invalid: ["invalid", "invalid", booleanAttribute], alignment: "alignment" }, outputs: { change: "change" }, host: { listeners: { "click": "handleClick($event)", "keydown": "handleKeyDown($event)" }, properties: { "class.igx-radio-group": "this.cssClass", "class.igx-radio-group--vertical": "this.vertical", "class.igx-radio-group--before": "this.labelBefore", "class.igx-radio-group--disabled": "this.disabled" } }, exportAs: ["igxRadioGroup"], ngImport: i0 }); }
|
|
591
595
|
}
|
|
592
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
596
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioGroupDirective, decorators: [{
|
|
593
597
|
type: Directive,
|
|
594
598
|
args: [{
|
|
595
599
|
exportAs: 'igxRadioGroup',
|
|
@@ -827,14 +831,14 @@ class IgxRadioComponent extends CheckboxBaseDirective {
|
|
|
827
831
|
this.radioGroup._removeRadioButton(this);
|
|
828
832
|
}
|
|
829
833
|
}
|
|
830
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
831
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.
|
|
834
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
835
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.2.0", type: IgxRadioComponent, isStandalone: true, selector: "igx-radio", inputs: { checked: ["checked", "checked", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], invalid: ["invalid", "invalid", booleanAttribute] }, host: { listeners: { "change": "_changed($event)", "click": "_onCheckboxClick()", "blur": "onBlur()" }, properties: { "class.igx-radio": "this.cssClass", "class.igx-radio--checked": "this.checked", "class.igx-radio--disabled": "this.disabled", "class.igx-radio--invalid": "this.invalid", "class.igx-radio--focused": "this.focused" } }, providers: [{
|
|
832
836
|
provide: EDITOR_PROVIDER,
|
|
833
837
|
useExisting: IgxRadioComponent,
|
|
834
838
|
multi: true
|
|
835
839
|
}], usesInheritance: true, ngImport: i0, template: "<input #checkbox class=\"igx-radio__input\" type=\"radio\"\n [id]=\"inputId\"\n [name]=\"name\"\n [value]=\"value\"\n [tabindex]=\"tabindex\"\n [disabled]=\"disabled\"\n [checked]=\"checked\"\n [required]=\"required\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [attr.aria-checked]=\"checked\"\n [attr.aria-labelledby]=\"ariaLabel ? null : ariaLabelledBy\"\n [attr.aria-label]=\"ariaLabel\"\n (blur)=\"onBlur()\" />\n\n<span #label class=\"igx-radio__composite\" igxRipple\n igxRippleTarget=\".igx-radio__ripple\"\n [igxRippleDisabled]=\"disableRipple\"\n [igxRippleCentered]=\"true\"\n [igxRippleDuration]=\"300\">\n <div class=\"igx-radio__ripple\"></div>\n</span>\n\n<span #placeholderLabel\n [id]=\"labelId\"\n [class]=\"labelClass\">\n <ng-content></ng-content>\n</span>\n", styles: ["@property --ig-radio-ready{syntax:\"<number>\";inherits:true;initial-value:0}@layer ig.base{@keyframes scale-in-out{50%{transform:scale(.9);transform-origin:50% 50%}to{transform:scale(1);transform-origin:50% 50%}}@keyframes radio-ready{0%{--ig-radio-ready: 0}to{--ig-radio-ready: 1}}.igx-radio__label--before,.igx-radio__label{color:var(--label-color);-webkit-user-select:none;-moz-user-select:none;user-select:none;word-wrap:break-all}.igx-radio__label--before:empty,.igx-radio__label:empty{display:none}.igx-radio--focused.igx-radio--invalid .igx-radio__ripple,.igx-radio--focused.igx-radio--checked .igx-radio__ripple,.igx-radio--focused:hover .igx-radio__ripple,.igx-radio--focused .igx-radio__ripple,.igx-radio--invalid:active .igx-radio__ripple,.igx-radio--invalid:hover .igx-radio__ripple,.igx-radio--checked:active .igx-radio__ripple,.igx-radio--checked:hover .igx-radio__ripple,.igx-radio:active .igx-radio__ripple,.igx-radio:hover .igx-radio__ripple{background:var(--empty-color);transition:background .2s cubic-bezier(.25,.46,.45,.94)}.igx-radio--invalid:active .igx-radio__ripple,.igx-radio--invalid:hover .igx-radio__ripple,.igx-radio--checked:active .igx-radio__ripple,.igx-radio--checked:hover .igx-radio__ripple,.igx-radio:active .igx-radio__ripple,.igx-radio:hover .igx-radio__ripple{opacity:.06}@container style(--ig-theme-variant: dark){.igx-radio--invalid:active .igx-radio__ripple,.igx-radio--invalid:hover .igx-radio__ripple,.igx-radio--checked:active .igx-radio__ripple,.igx-radio--checked:hover .igx-radio__ripple,.igx-radio:active .igx-radio__ripple,.igx-radio:hover .igx-radio__ripple{opacity:.12}}.igx-radio--checked:active .igx-radio__ripple,.igx-radio--checked:hover .igx-radio__ripple{background:var(--fill-color)}.igx-radio--invalid:active .igx-radio__ripple,.igx-radio--invalid:hover .igx-radio__ripple{background:var(--error-color)}.igx-radio--invalid:active .igx-radio__ripple,.igx-radio--checked:active .igx-radio__ripple,.igx-radio:active .igx-radio__ripple,.igx-radio--focused.igx-radio--invalid .igx-radio__ripple,.igx-radio--focused.igx-radio--checked .igx-radio__ripple,.igx-radio--focused:hover .igx-radio__ripple,.igx-radio--focused .igx-radio__ripple{opacity:.12}@container style(--ig-theme-variant: dark){.igx-radio--invalid:active .igx-radio__ripple,.igx-radio--checked:active .igx-radio__ripple,.igx-radio:active .igx-radio__ripple,.igx-radio--focused.igx-radio--invalid .igx-radio__ripple,.igx-radio--focused.igx-radio--checked .igx-radio__ripple,.igx-radio--focused:hover .igx-radio__ripple,.igx-radio--focused .igx-radio__ripple{opacity:.24}}.igx-radio{position:relative;display:inline-flex;flex-flow:row nowrap;align-items:center;color:var(--label-color);width:-moz-max-content;width:max-content;cursor:pointer;animation:radio-ready 1ms linear .12s forwards}.igx-radio:hover .igx-radio__label{color:var(--label-color-hover)}.igx-radio:hover .igx-radio__composite:before{background:var(--hover-color)}.igx-radio:active .igx-radio__composite:before{background:var(--hover-color)}.igx-radio__input{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0,0,0,0);outline:0;pointer-events:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.igx-radio__composite{position:relative;display:inline-block;width:var(--size);height:var(--size);min-width:var(--size);line-height:var(--size);color:var(--label-color);-webkit-user-select:none;-moz-user-select:none;user-select:none;--ig-ripple-color: var(--empty-color)}.igx-radio__composite:before,.igx-radio__composite:after{position:absolute;content:\"\";width:var(--size);height:var(--size);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-radio__composite:before{backface-visibility:hidden;z-index:1;transform:scale(0)}@container style(--ig-radio-ready: 1){.igx-radio__composite:before{transition:all .2s cubic-bezier(.25,.46,.45,.94)}}.igx-radio__composite:after{border:var(--border-width) solid var(--empty-color);background:var(--empty-fill-color)}.igx-radio__label{margin-inline-start:var(--label-margin)}.igx-radio__label--before{order:-1;margin-inline-end:var(--label-margin)}.igx-radio__ripple{--_ripple-size: 2.5rem;display:none;position:absolute;top:calc(50% - var(--_ripple-size)/2);inset-inline-start:calc(50% - var(--_ripple-size)/2);width:var(--_ripple-size);aspect-ratio:1;border-radius:calc(var(--_ripple-size)/2);overflow:hidden;pointer-events:none;filter:opacity(1)}.igx-radio--checked .igx-radio__composite{--ig-ripple-color: var(--fill-color)}.igx-radio--checked .igx-radio__composite:before{border:var(--border-width) solid var(--fill-color);background:var(--fill-color);transform:var(--scale)}.igx-radio--checked .igx-radio__composite:after{border:var(--border-width) solid var(--fill-color)}.igx-radio--checked:hover .igx-radio__composite:before{background:var(--fill-color-hover);border-color:var(--fill-hover-border-color)}.igx-radio--checked:hover .igx-radio__composite:after{border-color:var(--fill-hover-border-color)}.igx-radio--checked:active .igx-radio__composite:before{background:var(--fill-color-hover);border-color:var(--fill-hover-border-color)}.igx-radio--checked:active .igx-radio__composite:after{border-color:var(--fill-hover-border-color)}.igx-radio--focused.igx-radio--checked:hover .igx-radio__composite:before{background:var(--fill-color-hover);border-color:var(--fill-hover-border-color)}.igx-radio--focused.igx-radio--checked:hover .igx-radio__composite:after{border-color:var(--fill-hover-border-color)}.igx-radio--focused.igx-radio--checked:active .igx-radio__composite:before{background:var(--fill-color-hover);border-color:var(--fill-hover-border-color)}.igx-radio--focused.igx-radio--checked:active .igx-radio__composite:after{border-color:var(--fill-hover-border-color)}.igx-radio--focused.igx-radio--checked .igx-radio__ripple{background:var(--fill-color)}.igx-radio--invalid .igx-radio__composite{--ig-ripple-color: var(--error-color)}.igx-radio--invalid .igx-radio__composite:after{border:var(--border-width) solid var(--error-color)}.igx-radio--invalid .igx-radio__label,.igx-radio--invalid .igx-radio__label--before,.igx-radio--invalid:hover .igx-radio__label{color:var(--error-color)}.igx-radio--invalid:hover .igx-radio__composite:before{background:var(--error-color)}.igx-radio--invalid:hover .igx-radio__composite:after{border-color:var(--error-color)}.igx-radio--invalid:active .igx-radio__composite:before{background:var(--error-color)}.igx-radio--invalid:active .igx-radio__composite:after{border-color:var(--error-color-hover)}.igx-radio--focused.igx-radio--invalid .igx-radio__ripple{background:var(--error-color)}.igx-radio--checked.igx-radio--invalid .igx-radio__composite:after{border:var(--border-width) solid var(--error-color)}.igx-radio--checked.igx-radio--invalid .igx-radio__composite:before{background:var(--error-color);border:var(--border-width) solid rgba(0,0,0,0)}.igx-radio--checked.igx-radio--invalid:hover .igx-radio__composite:before{background:var(--error-color-hover);border-color:var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid:hover .igx-radio__composite:after{border:var(--border-width) solid var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid:active .igx-radio__composite:before{background:var(--error-color-hover);border-color:var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid:active .igx-radio__composite:after{border:var(--border-width) solid var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid.igx-radio--focused .igx-radio__composite:after{border:var(--border-width) solid var(--error-color)}.igx-radio--checked.igx-radio--invalid.igx-radio--focused .igx-radio__composite:before{background:var(--error-color);border-color:var(--error-color)}.igx-radio--disabled{pointer-events:none;color:var(--disabled-label-color);-webkit-user-select:none;-moz-user-select:none;user-select:none}.igx-radio--disabled .igx-radio__composite:after{border:var(--border-width) solid var(--disabled-color)}.igx-radio--disabled .igx-radio__label,.igx-radio--disabled .igx-radio__label--before{color:var(--disabled-label-color)}.igx-radio--disabled.igx-radio--checked .igx-radio__composite:after{border:var(--border-width) solid var(--disabled-fill-color)}.igx-radio--disabled.igx-radio--checked .igx-radio__composite:before{background:var(--disabled-fill-color);border:var(--border-width) solid rgba(0,0,0,0)}.igx-radio-group{display:grid;-moz-column-gap:var(--horizontal-group-margin);column-gap:var(--horizontal-group-margin);align-items:start;width:-moz-max-content;width:max-content}.igx-radio-group:not(.igx-radio-group--vertical) [igxLabel]{margin-block-end:1rem}.igx-radio-group:not(.igx-radio-group--vertical) igx-radio{grid-row:2}.igx-radio-group--vertical{row-gap:var(--vertical-group-margin)}.igx-radio-group--vertical [igxLabel]{margin-block-end:.5rem}.igx-radio-group--before.igx-radio-group--vertical igx-radio,.igx-radio-group--before.igx-radio-group--vertical [igxLabel]{justify-self:flex-end}.igx-radio-group--disabled [igxLabel]{color:var(--disabled-color)}}@layer ig.material{@container style(--ig-theme: material){.igx-radio{--size: 2.5rem;--label-margin: .125rem;--scale: scale(.5);--border-width: .125rem}.igx-radio__composite:before,.igx-radio__composite:after{width:calc(var(--size)/2);height:calc(var(--size)/2);top:25%;inset-inline-start:25%}.igx-radio__ripple{display:block}.igx-radio__label{font-family:var(--ig-subtitle-1-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-1-font-size);font-weight:var(--ig-subtitle-1-font-weight);font-style:var(--ig-subtitle-1-font-style);line-height:var(--ig-subtitle-1-line-height);letter-spacing:var(--ig-subtitle-1-letter-spacing);text-transform:var(--ig-subtitle-1-text-transform);margin-top:var(--ig-subtitle-1-margin-top);margin-bottom:var(--ig-subtitle-1-margin-bottom);margin-block:0}igx-radio--invalid:hover,.igx-radio__composite{border-color:var(--error-color)}}}@layer ig.material{@container style(--ig-theme: material){.igx-radio-group{--horizontal-group-margin: 1rem;--vertical-group-margin: 0}.igx-radio-group--vertical [igxLabel]{margin-block-end:1rem}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-radio{--size: 1rem;--label-margin: .5rem;--scale: scale(.4375);--border-width: .0625rem}.igx-radio__label{font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin-block:0}.igx-radio__composite:before{transition:none}.igx-radio:hover .igx-radio__composite:after{border:var(--border-width) solid var(--hover-color);transition:all .2s ease-in}.igx-radio--checked .igx-radio__composite:before{border-color:var(--fill-hover-border-color);background:var(--fill-hover-border-color)}.igx-radio--checked .igx-radio__composite:after{background:var(--fill-color)}.igx-radio--checked:hover .igx-radio__composite:after{background:var(--fill-color-hover);border-color:var(--fill-color-hover)}.igx-radio--checked:active .igx-radio__composite:after{background:var(--fill-color-hover);border-color:var(--fill-color-hover)}.igx-radio--focused .igx-radio__composite{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);box-shadow:0 0 0 .25rem var(--focus-outline-color)}.igx-radio--focused .igx-radio__composite:after{border-color:var(--focus-border-color)}.igx-radio--focused:hover .igx-radio__composite:after{border-color:hsl(from var(--focus-border-color) h calc(s*1.12) calc(l*.82))}.igx-radio--focused.igx-radio--checked .igx-radio__composite:after{border-color:#0000}.igx-radio--focused.igx-radio--checked:hover .igx-radio__composite:after{background:var(--fill-color-hover);border-color:var(--fill-color-hover)}.igx-radio--focused.igx-radio--checked:active .igx-radio__composite:after{background:var(--fill-color-hover);border-color:var(--fill-color-hover)}.igx-radio--invalid:hover .igx-radio__composite:after{border-color:var(--error-color-hover)}.igx-radio--focused.igx-radio--invalid .igx-radio__composite{box-shadow:0 0 0 .25rem var(--focus-outline-color-error)}.igx-radio--focused.igx-radio--invalid .igx-radio__composite:after{border:var(--border-width) solid var(--error-color)}.igx-radio--focused.igx-radio--invalid:hover .igx-radio__composite:after{border:var(--border-width) solid var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid .igx-radio__composite:after{background:var(--error-color)}.igx-radio--checked.igx-radio--invalid .igx-radio__composite:before{background:var(--fill-hover-border-color)}.igx-radio--checked.igx-radio--invalid:hover .igx-radio__composite:after{background:var(--error-color-hover);border-color:var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid:active .igx-radio__composite:after{background:var(--error-color-hover);border-color:var(--error-color-hover)}.igx-radio--invalid.igx-radio--disabled .igx-radio__composite:after{border-color:var(--disabled-color)}.igx-radio--checked.igx-radio--disabled .igx-radio__composite:after{background:var(--disabled-fill-color);border-color:var(--disabled-fill-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-radio-group{--horizontal-group-margin: .5rem;--vertical-group-margin: .5rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-radio{--size: 1.25rem;--label-margin: .5rem;--scale: scale(.5);--border-width: .0625rem}.igx-radio__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin-block:0}.igx-radio:hover .igx-radio__composite:before{transform:scale(.5)}.igx-radio--focused{position:relative}.igx-radio--focused:after{content:\"\";position:absolute;inset:-.125rem;box-shadow:0 0 0 .0625rem var(--focus-outline-color)}.igx-radio--invalid:hover .igx-radio__composite:after{border-color:var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid.igx-radio--focused:hover .igx-radio__composite:before{background:var(--error-color-hover);border-color:var(--error-color-hover)}.igx-radio--checked.igx-radio--invalid.igx-radio--focused:hover .igx-radio__composite:after{border-color:var(--error-color-hover)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-radio-group{--horizontal-group-margin: .75rem;--vertical-group-margin: .5rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-radio{--size: 1rem;--label-margin: .5rem;--scale: scale(.5);--border-width: .125rem}.igx-radio__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin-block:0}.igx-radio:hover .igx-radio__composite:after{border-color:var(--hover-color);transition:all .2s ease-in}.igx-radio--checked:hover .igx-radio__composite:after{border-color:var(--fill-hover-border-color)}.igx-radio--invalid .igx-radio__label,.igx-radio--invalid .igx-radio__label--before{color:var(--label-color)}.igx-radio--invalid:hover .igx-radio__composite:after{border-color:var(--error-color-hover)}.igx-radio--invalid:hover .igx-radio__label{color:var(--label-color-hover)}.igx-radio--invalid:active .igx-radio__composite:after{border-color:var(--error-color-hover)}.igx-radio--focused .igx-radio__composite{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);box-shadow:0 0 0 .1875rem var(--focus-outline-color)}.igx-radio--focused.igx-radio--checked .igx-radio__composite{box-shadow:0 0 0 .1875rem var(--focus-outline-color-filled)}.igx-radio--focused.igx-radio--invalid .igx-radio__composite{box-shadow:0 0 0 .1875rem var(--focus-outline-color-error)}.igx-radio--checked.igx-radio--invalid.igx-radio--focused:hover .igx-radio__composite:before{background:var(--error-color-hover);border-color:var(--error-color-hover)}.igx-radio--disabled .igx-radio__label,.igx-radio--disabled .igx-radio__label--before{color:var(--disabled-label-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-radio-group{--horizontal-group-margin: 1rem;--vertical-group-margin: .5rem}}}@layer ig.fluent{@container style(--ig-theme: fluent) and style(--ig-theme-variant: dark){.igx-radio--invalid:hover .igx-radio__composite:before{background:var(--ig-error-500)}.igx-radio--checked.igx-radio--invalid:hover .igx-radio__composite:before{background:var(--error-color-hover)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap) and style(--ig-theme-variant: dark){.igx-radio--disabled .igx-radio__composite:after{background:var(--ig-surface-500)}}}\n"], dependencies: [{ kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
836
840
|
}
|
|
837
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
841
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioComponent, decorators: [{
|
|
838
842
|
type: Component,
|
|
839
843
|
args: [{ selector: 'igx-radio', providers: [{
|
|
840
844
|
provide: EDITOR_PROVIDER,
|
|
@@ -888,11 +892,11 @@ const IGX_RADIO_GROUP_DIRECTIVES = [
|
|
|
888
892
|
* IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
|
|
889
893
|
*/
|
|
890
894
|
class IgxRadioModule {
|
|
891
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.
|
|
892
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.
|
|
893
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.
|
|
895
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
896
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioModule, imports: [IgxRadioGroupDirective, IgxRadioComponent], exports: [IgxRadioGroupDirective, IgxRadioComponent] }); }
|
|
897
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioModule }); }
|
|
894
898
|
}
|
|
895
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.
|
|
899
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRadioModule, decorators: [{
|
|
896
900
|
type: NgModule,
|
|
897
901
|
args: [{
|
|
898
902
|
imports: [IgxRadioGroupDirective, IgxRadioComponent],
|