@dsivd/prestations-ng 14.5.23-beta5 → 14.5.23-beta8

package/bundles/dsivd-prestations-ng.umd.js

@@ -8857,6 +8857,7 @@
             _this.dictionaryService = dictionaryService;
             _this.showEmptyListMessage = false;
             _this.srAnnouncements = '';
+            _this.SR_ANNOUNCEMENT_CLEAR_TIMEOUT_INTERVAL_MS = 2000;
             return _this;
         }
         Object.defineProperty(FoehnMultiselectAutocompleteComponent.prototype, "defaultElementValues", {
@@ -8924,7 +8925,7 @@
             return _super.prototype.getLabel.call(this, elem);
         };
         FoehnMultiselectAutocompleteComponent.prototype.canBeDeleted = function (index) {
-            return !this.defaultElementValues || !this.defaultElementValues.includes(this.model[index]);
+            return !this.disabled && (!this.defaultElementValues || !this.defaultElementValues.includes(this.model[index]));
         };
         FoehnMultiselectAutocompleteComponent.prototype.onAutocompleteElementsLoaded = function (elements) {
             var _this = this;
@@ -8944,7 +8945,7 @@
         FoehnMultiselectAutocompleteComponent.prototype.findElementByModelItem = function (item) {
             var _this = this;
             if (!!this.elements && !!this.elements.length) {
-                var itemValue_1 = typeof item === 'string' ? item : this.getValue(item);
+                var itemValue_1 = typeof item !== 'object' ? item : this.getValue(item);
                 var elem = this.elements.find(function (element) { return _this.getValue(element) === itemValue_1; });
                 if (!!elem) {
                     return elem;
@@ -9007,12 +9008,20 @@
             }
         };
         FoehnMultiselectAutocompleteComponent.prototype.manageSuggestionListAndFocusAfterRemovingAnItem = function () {
+            var _this = this;
             // Hide message saying no more suggestions to display
             this.showEmptyListMessage = false;
             // Manually show autocomplete because there is at least one suggestions to display
             this.autocompleteComponent.inputElement.nativeElement.hidden = false;
             // Add back selected item to autocomplete suggestion list
             this.autocompleteComponent.elements = this.filterAutocompleteElements(this.elements);
+            // When deleting a selected item, check were to set focus back when no more items to delete
+            this.selectedElemRef.changes.pipe(operators.first()).subscribe(function () {
+                var selectedElemRefArray = __spreadArray([], __read(_this.selectedElemRef.toArray()));
+                if (!selectedElemRefArray.length && !!_this.selectedItemsArea) {
+                    _this.selectedItemsArea.nativeElement.focus();
+                }
+            });
         };
         FoehnMultiselectAutocompleteComponent.prototype.showAlertMessageAndHideAutocomplete = function () {
             // Show a message to user indicating there is no more suggestions to display
@@ -9023,16 +9032,16 @@
         };
         FoehnMultiselectAutocompleteComponent.prototype.manageScreenReaderAnnouncement = function (element, isDelete) {
             var _this = this;
-            clearTimeout(this.srAnnouncementAutoClearTimer);
+            clearTimeout(this.srAnnouncementClearTimer);
             if (isDelete) {
                 this.srAnnouncements += "" + this.dictionaryService.getKeySync('foehn-multiselect-autocomplete.sr-announcement.deleted', { elementLabel: this.getLabel(element) });
             }
             else {
                 this.srAnnouncements += "" + this.dictionaryService.getKeySync('foehn-multiselect-autocomplete.sr-announcement.added', { elementLabel: this.getLabel(element) });
             }
-            this.srAnnouncementAutoClearTimer = setTimeout(function () {
+            this.srAnnouncementClearTimer = setTimeout(function () {
                 _this.srAnnouncements = '';
-            }, 10000);
+            }, this.SR_ANNOUNCEMENT_CLEAR_TIMEOUT_INTERVAL_MS);
         };
         return FoehnMultiselectAutocompleteComponent;
     }(FoehnAutocompleteComponent));
@@ -9043,7 +9052,7 @@
                 useExisting: i0.forwardRef(function () { return FoehnMultiselectAutocompleteComponent; }),
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "autocompleteComponent", first: true, predicate: ["autocompleteComponent"], descendants: true }, { propertyName: "alertMessageContainer", first: true, predicate: ["alertMessageContainer"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<foehn-autocomplete\n    #autocompleteComponent\n    [name]=\"name\"\n    [label]=\"label\"\n    [elements]=\"elements\"\n    [elementsUrl]=\"elementsUrl\"\n    [elementValue]=\"elementValue\"\n    [elementLabel]=\"elementLabel\"\n    [elementValueIdentity]=\"elementValueIdentity\"\n    [elementDisabled]=\"elementDisabled\"\n    [allElementDisabled]=\"allElementDisabled\"\n    [elementGroup]=\"elementGroup\"\n    [allowCustomValue]=\"false\"\n    [searchValueMinCharsCount]=\"searchValueMinCharsCount\"\n    [customValueModelGenerator]=\"customValueModelGenerator\"\n    [required]=\"required\"\n    [disabled]=\"disabled\"\n    (userInput)=\"addItem($event)\"\n    [(model)]=\"autocompleteInputValue\"\n    (elementsLoaded)=\"onAutocompleteElementsLoaded($event)\"\n>\n    <small\n        *ngIf=\"!showEmptyListMessage\"\n        [attr.id]=\"buildChildId('Help')\"\n        class=\"form-text text-secondary\"\n        [innerHTML]=\"helpText ? helpText : 'foehn-multiselect-autocomplete.autocomplete.screen-reader.label' | fromDictionary\"\n    ></small>\n\n    <div\n        [id]=\"buildChildId('AlertMessageContainer')\"\n        role=\"status\"\n        #alertMessageContainer\n    >\n        <p\n            *ngIf=\"showEmptyListMessage\"\n            class=\"alert alert-info\"\n            tabindex=\"0\"\n        >{{'foehn-multiselect-autocomplete.autocomplete.empty-message' | fromDictionary}}</p>\n    </div>\n</foehn-autocomplete>\n\n<p\n    class=\"sr-only\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n>\n    {{srAnnouncements}}\n</p>\n\n<div\n    role=\"presentation\"\n    class=\"selected-list-container d-flex align-content-stretch flex-wrap\"\n    [ngClass]=\"!!model && !!model.length ? 'mb-2' : 'mb-0'\"\n>\n    <ng-container *ngFor=\"let element of model; let index = index; trackBy: trackByFn\">\n        <span\n            *ngIf=\"!canBeDeleted(index)\"\n            class=\"badge badge-pill badge-secondary mr-1 mb-1 py-2 px-3 d-flex align-items-center\"\n            [tabindex]=\"0\"\n            [attr.aria-describedby]=\"buildChildId('Label')\"\n        >\n            {{getLabel(element)}}\n        </span>\n        <button\n            *ngIf=\"canBeDeleted(index)\"\n            class=\"btn btn-secondary badge badge-pill mr-1 mb-1 py-2 px-3 d-flex align-items-center\"\n            [tabindex]=\"0\"\n            [attr.aria-label]=\"getDeleteButtonAriaLabel(element)\"\n            [attr.aria-describedby]=\"buildChildId('Label')\"\n            [title]=\"getDeleteButtonAriaLabel(element)\"\n            (click)=\"removeItem(element)\"\n        >\n            {{getLabel(element)}}\n            <foehn-icon-times\n                aria-hidden=\"true\"\n                class=\"ml-2\"\n                [title]=\"getDeleteButtonAriaLabel(element)\"\n            ></foehn-icon-times>\n        </button>\n    </ng-container>\n</div>\n", styles: ["foehn-autocomplete p.alert:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem #ffbf47}.selected-list-container button>.btn,.btn-link{line-height:inherit;padding:0}.selected-list-container .btn{text-transform:none}.selected-list-container span.badge-pill:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem #ffbf47}\n"], components: [{ type: FoehnAutocompleteComponent, selector: "foehn-autocomplete", inputs: ["searchValueMinCharsCount", "allowCustomValue", "customValueModelGenerator"] }, { type: FoehnIconTimesComponent, selector: "foehn-icon-times" }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "fromDictionary": SdkDictionaryPipe } });
+        ], viewQueries: [{ propertyName: "autocompleteComponent", first: true, predicate: ["autocompleteComponent"], descendants: true }, { propertyName: "alertMessageContainer", first: true, predicate: ["alertMessageContainer"], descendants: true }, { propertyName: "selectedItemsArea", first: true, predicate: ["selectedItemsArea"], descendants: true }, { propertyName: "selectedElemRef", predicate: ["selectedElemRef"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<foehn-autocomplete\n    #autocompleteComponent\n    [name]=\"name\"\n    [label]=\"label\"\n    [elements]=\"elements\"\n    [elementsUrl]=\"elementsUrl\"\n    [elementValue]=\"elementValue\"\n    [elementLabel]=\"elementLabel\"\n    [elementValueIdentity]=\"elementValueIdentity\"\n    [elementDisabled]=\"elementDisabled\"\n    [allElementDisabled]=\"allElementDisabled\"\n    [elementGroup]=\"elementGroup\"\n    [allowCustomValue]=\"false\"\n    [searchValueMinCharsCount]=\"searchValueMinCharsCount\"\n    [customValueModelGenerator]=\"customValueModelGenerator\"\n    [required]=\"required\"\n    [disabled]=\"disabled\"\n    (userInput)=\"addItem($event)\"\n    [(model)]=\"autocompleteInputValue\"\n    (elementsLoaded)=\"onAutocompleteElementsLoaded($event)\"\n>\n    <small\n        *ngIf=\"!showEmptyListMessage\"\n        [attr.id]=\"buildChildId('Help')\"\n        class=\"form-text text-secondary\"\n        [innerHTML]=\"helpText ? helpText : 'foehn-multiselect-autocomplete.autocomplete.screen-reader.label' | fromDictionary\"\n    ></small>\n\n    <div\n        [id]=\"buildChildId('AlertMessageContainer')\"\n        role=\"status\"\n        #alertMessageContainer\n    >\n        <p\n            *ngIf=\"showEmptyListMessage\"\n            class=\"alert alert-info\"\n            tabindex=\"0\"\n        >{{'foehn-multiselect-autocomplete.autocomplete.empty-message' | fromDictionary}}</p>\n    </div>\n</foehn-autocomplete>\n\n<p\n    class=\"sr-only\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n>\n    {{srAnnouncements}}\n</p>\n\n<div\n    role=\"presentation\"\n    class=\"selected-list-container d-flex align-content-stretch flex-wrap\"\n    [ngClass]=\"!!model && !!model.length ? 'mb-2' : 'mb-0'\"\n    #selectedItemsArea\n>\n    <ng-container *ngFor=\"let element of model; let index = index; trackBy: trackByFn\">\n        <span\n            *ngIf=\"!canBeDeleted(index)\"\n            class=\"badge badge-pill badge-secondary mr-1 mb-1 py-2 px-3 d-flex align-items-center\"\n            [tabindex]=\"disabled ? -1 : 0\"\n            [attr.aria-describedby]=\"buildChildId('Label')\"\n        >\n            {{getLabel(element)}}\n        </span>\n        <button\n            *ngIf=\"canBeDeleted(index)\"\n            class=\"btn btn-secondary badge badge-pill mr-1 mb-1 py-2 px-3 d-flex align-items-center\"\n            [tabindex]=\"0\"\n            [attr.aria-label]=\"getDeleteButtonAriaLabel(element)\"\n            [attr.aria-describedby]=\"buildChildId('Label')\"\n            [title]=\"getDeleteButtonAriaLabel(element)\"\n            (click)=\"removeItem(element)\"\n            #selectedElemRef\n        >\n            {{getLabel(element)}}\n            <foehn-icon-times\n                aria-hidden=\"true\"\n                class=\"ml-2\"\n                [title]=\"getDeleteButtonAriaLabel(element)\"\n            ></foehn-icon-times>\n        </button>\n    </ng-container>\n</div>\n", styles: ["foehn-autocomplete p.alert:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem #ffbf47}.selected-list-container button>.btn,.btn-link{line-height:inherit;padding:0}.selected-list-container .btn{text-transform:none}.selected-list-container span.badge-pill:focus{outline:0;box-shadow:inset 0 1px 1px #00000013,0 0 0 .2rem #ffbf47}\n"], components: [{ type: FoehnAutocompleteComponent, selector: "foehn-autocomplete", inputs: ["searchValueMinCharsCount", "allowCustomValue", "customValueModelGenerator"] }, { type: FoehnIconTimesComponent, selector: "foehn-icon-times" }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "fromDictionary": SdkDictionaryPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: FoehnMultiselectAutocompleteComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -9064,6 +9073,12 @@
                 }], alertMessageContainer: [{
                     type: i0.ViewChild,
                     args: ['alertMessageContainer']
+                }], selectedElemRef: [{
+                    type: i0.ViewChildren,
+                    args: ['selectedElemRef']
+                }], selectedItemsArea: [{
+                    type: i0.ViewChild,
+                    args: ['selectedItemsArea']
                 }], defaultElementValues: [{
                     type: i0.Input
                 }], defaultElementValue: [{