@sebgroup/green-angular 6.0.2 → 6.0.3
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/esm2022/lib/dropdown/dropdown.component.mjs +24 -4
- package/esm2022/src/lib/dropdown/dropdown.component.mjs +24 -4
- package/fesm2022/sebgroup-green-angular-src-lib-dropdown.mjs +23 -3
- package/fesm2022/sebgroup-green-angular-src-lib-dropdown.mjs.map +1 -1
- package/fesm2022/sebgroup-green-angular.mjs +23 -3
- package/fesm2022/sebgroup-green-angular.mjs.map +1 -1
- package/lib/dropdown/dropdown.component.d.ts +7 -2
- package/package.json +2 -2
- package/src/lib/dropdown/dropdown.component.d.ts +7 -2
|
@@ -805,7 +805,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
805
805
|
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
806
806
|
|
|
807
807
|
class NggDropdownComponent {
|
|
808
|
-
//
|
|
809
808
|
set options(value) {
|
|
810
809
|
this._options = value;
|
|
811
810
|
this.texts = {
|
|
@@ -931,6 +930,24 @@ class NggDropdownComponent {
|
|
|
931
930
|
select: this.displayTextByValue(this._value),
|
|
932
931
|
};
|
|
933
932
|
}
|
|
933
|
+
ngAfterViewInit() {
|
|
934
|
+
if (this.formInfoContent) {
|
|
935
|
+
// Example: observe changes to the formInfoContent element
|
|
936
|
+
this.errorMessageObserver = new MutationObserver(() => {
|
|
937
|
+
this.errorMessage = this.formInfoContent?.nativeElement.textContent;
|
|
938
|
+
this._cdr.detectChanges();
|
|
939
|
+
});
|
|
940
|
+
this.errorMessageObserver.observe(this.formInfoContent.nativeElement, {
|
|
941
|
+
childList: true,
|
|
942
|
+
subtree: true,
|
|
943
|
+
});
|
|
944
|
+
}
|
|
945
|
+
}
|
|
946
|
+
ngOnDestroy() {
|
|
947
|
+
if (this.errorMessageObserver) {
|
|
948
|
+
this.errorMessageObserver.disconnect();
|
|
949
|
+
}
|
|
950
|
+
}
|
|
934
951
|
writeValue(value) {
|
|
935
952
|
this.value = value;
|
|
936
953
|
this._cdr.detectChanges();
|
|
@@ -951,7 +968,7 @@ class NggDropdownComponent {
|
|
|
951
968
|
useExisting: NggDropdownComponent,
|
|
952
969
|
multi: true,
|
|
953
970
|
},
|
|
954
|
-
], queries: [{ propertyName: "customOption", first: true, predicate: NggDropdownOptionDirective, descendants: true }, { propertyName: "customButton", first: true, predicate: NggDropdownButtonDirective, descendants: true }], viewQueries: [{ propertyName: "gdsDropdown", first: true, predicate: ["gdsDropdown"], descendants: true }], ngImport: i0, template: "<div class=\"form-group\">\n <gds-dropdown\n *nggCoreElement\n #gdsDropdown\n [value]=\"value\"\n [searchable]=\"searchable\"\n [label]=\"label\"\n (change)=\"onValueChange($event)\"\n [multiple]=\"multiSelect\"\n [invalid]=\"invalid\"\n [compareWith]=\"compareWithAdapter\"\n [searchFilter]=\"searchFilterAdapter\"\n [syncPopoverWidth]=\"syncPopoverWidth\"\n [size]=\"size\"\n [hideLabel]=\"hideLabel\"\n [maxHeight]=\"maxHeight\"\n [disableMobileStyles]=\"disableMobileStyles\"\n >\n <span slot=\"message\" #formInfo\n ><ng-content select=\"[data-form-info]\"></ng-content\n ></span>\n\n <span slot=\"trigger\" style=\"display: contents\"\n ><ng-container\n *ngTemplateOutlet=\"\n customButton?.templateRef && selectedOption\n ? customButton!.templateRef\n : defaultButton;\n context: { option: selectedOption }\n \"\n ></ng-container\n ></span>\n\n <ng-container *ngFor=\"let option of options; let index = index\">\n <ng-container *ngIf=\"!option.heading; else optionHeading\">\n <gds-option *nggCoreElement [value]=\"option[useValue]\"\n ><ng-container\n *ngTemplateOutlet=\"\n customOption?.templateRef\n ? customOption!.templateRef\n : defaultOption;\n context: { option: option, index: index }\n \"\n ></ng-container\n ></gds-option>\n </ng-container>\n <ng-template #optionHeading>\n <gds-menu-heading *nggCoreElement>{{ option.label }}</gds-menu-heading>\n </ng-template>\n </ng-container>\n </gds-dropdown>\n</div>\n\n<ng-template #defaultButton let-selected=\"option\">\n <span class=\"ngg-dropdown-default-trigger\">{{ texts?.select }}</span>\n</ng-template>\n\n<ng-template #defaultOption let-option=\"option\">\n {{ display ? option[display] : option.name }}\n</ng-template>\n", styles: [".ngg-dropdown-default-trigger{display:block;overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NggCoreElementDirective, selector: "[nggCoreElement]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
971
|
+
], queries: [{ propertyName: "customOption", first: true, predicate: NggDropdownOptionDirective, descendants: true }, { propertyName: "customButton", first: true, predicate: NggDropdownButtonDirective, descendants: true }], viewQueries: [{ propertyName: "formInfoContent", first: true, predicate: ["formInfo"], descendants: true }, { propertyName: "gdsDropdown", first: true, predicate: ["gdsDropdown"], descendants: true }], ngImport: i0, template: "<div class=\"form-group\">\n <gds-dropdown\n *nggCoreElement\n #gdsDropdown\n [value]=\"value\"\n [searchable]=\"searchable\"\n [label]=\"label\"\n (change)=\"onValueChange($event)\"\n [multiple]=\"multiSelect\"\n [invalid]=\"invalid\"\n [errorMessage]=\"errorMessage\"\n [compareWith]=\"compareWithAdapter\"\n [searchFilter]=\"searchFilterAdapter\"\n [syncPopoverWidth]=\"syncPopoverWidth\"\n [size]=\"size\"\n [hideLabel]=\"hideLabel\"\n [maxHeight]=\"maxHeight\"\n [disableMobileStyles]=\"disableMobileStyles\"\n >\n <span slot=\"message\" #formInfo\n ><ng-content select=\"[data-form-info]\"></ng-content\n ></span>\n\n <span slot=\"trigger\" style=\"display: contents\"\n ><ng-container\n *ngTemplateOutlet=\"\n customButton?.templateRef && selectedOption\n ? customButton!.templateRef\n : defaultButton;\n context: { option: selectedOption }\n \"\n ></ng-container\n ></span>\n\n <ng-container *ngFor=\"let option of options; let index = index\">\n <ng-container *ngIf=\"!option.heading; else optionHeading\">\n <gds-option *nggCoreElement [value]=\"option[useValue]\"\n ><ng-container\n *ngTemplateOutlet=\"\n customOption?.templateRef\n ? customOption!.templateRef\n : defaultOption;\n context: { option: option, index: index }\n \"\n ></ng-container\n ></gds-option>\n </ng-container>\n <ng-template #optionHeading>\n <gds-menu-heading *nggCoreElement>{{ option.label }}</gds-menu-heading>\n </ng-template>\n </ng-container>\n </gds-dropdown>\n</div>\n\n<ng-template #defaultButton let-selected=\"option\">\n <span class=\"ngg-dropdown-default-trigger\">{{ texts?.select }}</span>\n</ng-template>\n\n<ng-template #defaultOption let-option=\"option\">\n {{ display ? option[display] : option.name }}\n</ng-template>\n", styles: [".ngg-dropdown-default-trigger{display:block;overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NggCoreElementDirective, selector: "[nggCoreElement]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
955
972
|
}
|
|
956
973
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NggDropdownComponent, decorators: [{
|
|
957
974
|
type: Component,
|
|
@@ -961,7 +978,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
961
978
|
useExisting: NggDropdownComponent,
|
|
962
979
|
multi: true,
|
|
963
980
|
},
|
|
964
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-group\">\n <gds-dropdown\n *nggCoreElement\n #gdsDropdown\n [value]=\"value\"\n [searchable]=\"searchable\"\n [label]=\"label\"\n (change)=\"onValueChange($event)\"\n [multiple]=\"multiSelect\"\n [invalid]=\"invalid\"\n [compareWith]=\"compareWithAdapter\"\n [searchFilter]=\"searchFilterAdapter\"\n [syncPopoverWidth]=\"syncPopoverWidth\"\n [size]=\"size\"\n [hideLabel]=\"hideLabel\"\n [maxHeight]=\"maxHeight\"\n [disableMobileStyles]=\"disableMobileStyles\"\n >\n <span slot=\"message\" #formInfo\n ><ng-content select=\"[data-form-info]\"></ng-content\n ></span>\n\n <span slot=\"trigger\" style=\"display: contents\"\n ><ng-container\n *ngTemplateOutlet=\"\n customButton?.templateRef && selectedOption\n ? customButton!.templateRef\n : defaultButton;\n context: { option: selectedOption }\n \"\n ></ng-container\n ></span>\n\n <ng-container *ngFor=\"let option of options; let index = index\">\n <ng-container *ngIf=\"!option.heading; else optionHeading\">\n <gds-option *nggCoreElement [value]=\"option[useValue]\"\n ><ng-container\n *ngTemplateOutlet=\"\n customOption?.templateRef\n ? customOption!.templateRef\n : defaultOption;\n context: { option: option, index: index }\n \"\n ></ng-container\n ></gds-option>\n </ng-container>\n <ng-template #optionHeading>\n <gds-menu-heading *nggCoreElement>{{ option.label }}</gds-menu-heading>\n </ng-template>\n </ng-container>\n </gds-dropdown>\n</div>\n\n<ng-template #defaultButton let-selected=\"option\">\n <span class=\"ngg-dropdown-default-trigger\">{{ texts?.select }}</span>\n</ng-template>\n\n<ng-template #defaultOption let-option=\"option\">\n {{ display ? option[display] : option.name }}\n</ng-template>\n", styles: [".ngg-dropdown-default-trigger{display:block;overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}\n"] }]
|
|
981
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-group\">\n <gds-dropdown\n *nggCoreElement\n #gdsDropdown\n [value]=\"value\"\n [searchable]=\"searchable\"\n [label]=\"label\"\n (change)=\"onValueChange($event)\"\n [multiple]=\"multiSelect\"\n [invalid]=\"invalid\"\n [errorMessage]=\"errorMessage\"\n [compareWith]=\"compareWithAdapter\"\n [searchFilter]=\"searchFilterAdapter\"\n [syncPopoverWidth]=\"syncPopoverWidth\"\n [size]=\"size\"\n [hideLabel]=\"hideLabel\"\n [maxHeight]=\"maxHeight\"\n [disableMobileStyles]=\"disableMobileStyles\"\n >\n <span slot=\"message\" #formInfo\n ><ng-content select=\"[data-form-info]\"></ng-content\n ></span>\n\n <span slot=\"trigger\" style=\"display: contents\"\n ><ng-container\n *ngTemplateOutlet=\"\n customButton?.templateRef && selectedOption\n ? customButton!.templateRef\n : defaultButton;\n context: { option: selectedOption }\n \"\n ></ng-container\n ></span>\n\n <ng-container *ngFor=\"let option of options; let index = index\">\n <ng-container *ngIf=\"!option.heading; else optionHeading\">\n <gds-option *nggCoreElement [value]=\"option[useValue]\"\n ><ng-container\n *ngTemplateOutlet=\"\n customOption?.templateRef\n ? customOption!.templateRef\n : defaultOption;\n context: { option: option, index: index }\n \"\n ></ng-container\n ></gds-option>\n </ng-container>\n <ng-template #optionHeading>\n <gds-menu-heading *nggCoreElement>{{ option.label }}</gds-menu-heading>\n </ng-template>\n </ng-container>\n </gds-dropdown>\n</div>\n\n<ng-template #defaultButton let-selected=\"option\">\n <span class=\"ngg-dropdown-default-trigger\">{{ texts?.select }}</span>\n</ng-template>\n\n<ng-template #defaultOption let-option=\"option\">\n {{ display ? option[display] : option.name }}\n</ng-template>\n", styles: [".ngg-dropdown-default-trigger{display:block;overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}\n"] }]
|
|
965
982
|
}], ctorParameters: () => [{ type: i0.Injector, decorators: [{
|
|
966
983
|
type: Inject,
|
|
967
984
|
args: [Injector]
|
|
@@ -1013,6 +1030,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1013
1030
|
}], customButton: [{
|
|
1014
1031
|
type: ContentChild,
|
|
1015
1032
|
args: [NggDropdownButtonDirective]
|
|
1033
|
+
}], formInfoContent: [{
|
|
1034
|
+
type: ViewChild,
|
|
1035
|
+
args: ['formInfo', { static: false }]
|
|
1016
1036
|
}], gdsDropdown: [{
|
|
1017
1037
|
type: ViewChild,
|
|
1018
1038
|
args: ['gdsDropdown', { static: false }]
|