@provoly/dashboard 0.19.0 → 0.19.2-ltzrc

package/fesm2022/provoly-dashboard.mjs

@@ -524,7 +524,8 @@ const enTranslations$1 = {
                 text: 'Text',
                 date: 'Date',
                 list: 'List',
-                number: 'Number'
+                number: 'Number',
+                autocomplete: 'Autocomplete'
             }
         }
     }
@@ -874,7 +875,8 @@ const frTranslations$1 = {
                 text: 'Texte',
                 date: 'Date',
                 list: 'Liste',
-                number: 'Numérique'
+                number: 'Numérique',
+                autocomplete: 'Liste avec suggestion'
             }
         }
     }
@@ -1371,7 +1373,7 @@ const DashboardActions = {
     updateFilterValue: createAction('[Dashboard] (bus) update filter value', props()),
     clearAllFilterValues: createAction('[Dashboard] (bus) clear all filter values'),
     dispatchFilters: createAction('[Dashboard] (bus) apply filters to presentation datasources'),
-    resetWmsFeatures: createAction('[Widget map] Reset Wms layer features'),
+    resetWmsFeatures: createAction('[Widget map] Reset Wms layer features', props()),
     getWmsFeatures: createAction('[Widget map] Get Wms layer features', props()),
     addWmsFeatures: createAction('[Widget map] Set Wms layer features', props()),
     updateDisplayOptions: createAction('[Dashboard/Display] (bus) Update displayed dashboard management features', props()),
@@ -3888,7 +3890,13 @@ const datasourceFilters = createSelector(feature$4, (state) => state?.manifests.
     })),
         obj), {})
     : {});
-const wmsFeatures = createSelector(feature$4, (state) => state?.wmsFeatures);
+const memoizeFeatures = {};
+const wmsFeatures = (componentId) => {
+    if (!memoizeFeatures[componentId]) {
+        memoizeFeatures[componentId] = createSelector(feature$4, (state) => state.wmsFeatures[componentId] ?? []);
+    }
+    return memoizeFeatures[componentId];
+};
 const displayOptions = createSelector(feature$4, (state) => state?.display);
 const capabilities = createSelector(feature$4, (state) => state?.capabilities);
 const DashboardSelectors = {
@@ -4017,6 +4025,12 @@ class SearchService {
         this.transformations.forEach((func) => (transformed = func(id, transformed)));
         return transformed;
     }
+    autocomplete(attributes, search) {
+        return this.store.select(ConfigSelectors.dataUrl).pipe(switchMap((url) => this.httpClient.post(encodeURI(`${url}/dataset-versions/autocomplete`), {
+            attributes,
+            search
+        })));
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: SearchService, deps: [{ token: i1$2.HttpClient }, { token: i1.Store }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: SearchService, providedIn: 'root' }); }
 }
@@ -5189,7 +5203,7 @@ class PryBackendAggregationService extends PryAggregationService {
             params = params.set('groupBy', options.groupBy.attribute);
         }
         if (options.graph && options.graph.sort) {
-            params = params.set('sort', `${options.graph.sort.direction},${options.graph.sort.attribute === options.abscissa.attribute ? 'KEY' : 'VALUE'}`);
+            params = params.set('sort', `${options.graph.sort.direction},${(options.graph.sort.value ?? '').toUpperCase()}`);
         }
         params = this.searchService.getItemsFilter(targetDatasource, params);
         const key = `${this.dataUrl}_${params.toString()}`;
@@ -6444,10 +6458,6 @@ class PrySelectComponent {
             this._cd.markForCheck();
         }
     }
-    customSearchFn(term, item) {
-        term = term.toLocaleLowerCase();
-        return item.code.toLocaleLowerCase().indexOf(term) > -1 || item.countryName.toLocaleLowerCase().indexOf(term) > -1;
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySelectComponent, selector: "pry-select", inputs: { labelTranslate: "labelTranslate", baseTranslate: "baseTranslate", translationFn: "translationFn", translationFnArgs: "translationFnArgs", clearable: "clearable", multiple: "multiple", multipleClearRight: "multipleClearRight", closeOnSelect: "closeOnSelect", placeholder: "placeholder", isForm: "isForm", required: "required", name: "name", readonly: "readonly", items: "items", itemsAsOption: "itemsAsOption", bindData: "bindData", bindValue: "bindValue", bindLabel: "bindLabel", bindIcon: "bindIcon", iconSize: "iconSize", templateLabel: "templateLabel", templateOption: "templateOption", autocomplete: "autocomplete" }, providers: [
             {
@@ -6455,7 +6465,7 @@ class PrySelectComponent {
                 useExisting: forwardRef(() => PrySelectComponent),
                 multi: true
             }
-        ], ngImport: i0, template: "<ng-container *ngIf=\"itemsAsOption; else itemAsInput\">\n  <ng-select\n    class=\"a-pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindData ? undefined : bindValue\"\n    [bindLabel]=\"bindData ? undefined : bindLabel\"\n    [clearable]=\"clearable\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [searchable]=\"autocomplete\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n    <!-- Label part -->\n    <ng-container *ngIf=\"templateLabel; else noTemplateLabel\">\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <ng-container [ngTemplateOutlet]=\"templateLabel\" [ngTemplateOutletContext]=\"{ item, clear }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateLabel>\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <span\n          *ngIf=\"multiple && !multipleClearRight\"\n          class=\"ng-value-icon left\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n        <span class=\"ng-value-label\">\n          <ng-container *ngIf=\"bindIcon\">\n            <pry-icon\n              style=\"margin-right: 0.25em\"\n              [iconSvg]=\"item[bindIcon]\"\n              [width]=\"iconSize[0]\"\n              [height]=\"iconSize[1]\"\n              [animation]=\"false\"\n            ></pry-icon>\n          </ng-container>\n          <ng-container *ngIf=\"labelTranslate; else noTranslate\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFn\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFn>\n              <ng-container *ngIf=\"baseTranslate + (bindData ? item : item?.[bindLabel]) !== 'null'\">\n                {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n              </ng-container>\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslate>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n        <span\n          *ngIf=\"multiple && multipleClearRight\"\n          class=\"ng-value-icon right\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n      </ng-template>\n    </ng-template>\n\n    <!-- Option part -->\n    <ng-container *ngIf=\"templateOption; else noTemplateOption\">\n      <ng-template ng-option-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"templateOption\" [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateOption>\n      <ng-template ng-option-tmp let-item=\"item\">\n        <span class=\"ng-option-label\">\n          <pry-icon\n            *ngIf=\"bindIcon\"\n            [iconSvg]=\"item[bindIcon]\"\n            [width]=\"iconSize[0]\"\n            [height]=\"iconSize[1]\"\n            [animation]=\"false\"\n          ></pry-icon>\n          <ng-container *ngIf=\"labelTranslate; else noTranslateOption\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFnOption\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFnOption>\n              {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslateOption>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n      </ng-template>\n    </ng-template>\n  </ng-select>\n</ng-container>\n<ng-template #itemAsInput>\n  <ng-select\n    #select\n    class=\"pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindValue\"\n    [bindLabel]=\"bindLabel\"\n    [clearable]=\"clearable\"\n    [searchable]=\"autocomplete\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n  </ng-select>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2$2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2$2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "pipe", type: I18nPipe, name: "i18n" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], ngImport: i0, template: "<ng-container *ngIf=\"itemsAsOption; else itemAsInput\">\n  <ng-select\n    class=\"a-pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindData ? undefined : bindValue\"\n    [bindLabel]=\"bindData ? undefined : bindLabel\"\n    [clearable]=\"clearable\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [searchable]=\"autocomplete\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n    <!-- Label part -->\n    <ng-container *ngIf=\"templateLabel; else noTemplateLabel\">\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <ng-container [ngTemplateOutlet]=\"templateLabel\" [ngTemplateOutletContext]=\"{ item, clear }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateLabel>\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <span\n          *ngIf=\"multiple && !multipleClearRight\"\n          class=\"ng-value-icon left\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n        <span class=\"ng-value-label\">\n          <ng-container *ngIf=\"bindIcon\">\n            <pry-icon\n              style=\"margin-right: 0.25em\"\n              [iconSvg]=\"item[bindIcon]\"\n              [width]=\"iconSize[0]\"\n              [height]=\"iconSize[1]\"\n              [animation]=\"false\"\n            ></pry-icon>\n          </ng-container>\n          <ng-container *ngIf=\"labelTranslate; else noTranslate\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFn\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFn>\n              <ng-container *ngIf=\"baseTranslate + (bindData ? item : item?.[bindLabel]) !== 'null'\">\n                {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n              </ng-container>\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslate>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n        <span\n          *ngIf=\"multiple && multipleClearRight\"\n          class=\"ng-value-icon right\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n      </ng-template>\n    </ng-template>\n\n    <!-- Option part -->\n    <ng-container *ngIf=\"templateOption; else noTemplateOption\">\n      <ng-template ng-option-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"templateOption\" [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateOption>\n      <ng-template ng-option-tmp let-item=\"item\">\n        <span class=\"ng-option-label\">\n          <pry-icon\n            *ngIf=\"bindIcon\"\n            [iconSvg]=\"item[bindIcon]\"\n            [width]=\"iconSize[0]\"\n            [height]=\"iconSize[1]\"\n            [animation]=\"false\"\n          ></pry-icon>\n          <ng-container *ngIf=\"labelTranslate; else noTranslateOption\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFnOption\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFnOption>\n              {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslateOption>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n      </ng-template>\n    </ng-template>\n  </ng-select>\n</ng-container>\n<ng-template #itemAsInput>\n  <ng-select\n    #select\n    class=\"pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindValue\"\n    [bindLabel]=\"bindLabel\"\n    [clearable]=\"clearable\"\n    [searchable]=\"autocomplete\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n  </ng-select>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2$2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2$2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "pipe", type: I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySelectComponent, decorators: [{
             type: Component,
@@ -6465,7 +6475,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImpor
                             useExisting: forwardRef(() => PrySelectComponent),
                             multi: true
                         }
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"itemsAsOption; else itemAsInput\">\n  <ng-select\n    class=\"a-pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindData ? undefined : bindValue\"\n    [bindLabel]=\"bindData ? undefined : bindLabel\"\n    [clearable]=\"clearable\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [searchable]=\"autocomplete\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n    <!-- Label part -->\n    <ng-container *ngIf=\"templateLabel; else noTemplateLabel\">\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <ng-container [ngTemplateOutlet]=\"templateLabel\" [ngTemplateOutletContext]=\"{ item, clear }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateLabel>\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <span\n          *ngIf=\"multiple && !multipleClearRight\"\n          class=\"ng-value-icon left\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n        <span class=\"ng-value-label\">\n          <ng-container *ngIf=\"bindIcon\">\n            <pry-icon\n              style=\"margin-right: 0.25em\"\n              [iconSvg]=\"item[bindIcon]\"\n              [width]=\"iconSize[0]\"\n              [height]=\"iconSize[1]\"\n              [animation]=\"false\"\n            ></pry-icon>\n          </ng-container>\n          <ng-container *ngIf=\"labelTranslate; else noTranslate\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFn\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFn>\n              <ng-container *ngIf=\"baseTranslate + (bindData ? item : item?.[bindLabel]) !== 'null'\">\n                {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n              </ng-container>\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslate>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n        <span\n          *ngIf=\"multiple && multipleClearRight\"\n          class=\"ng-value-icon right\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n      </ng-template>\n    </ng-template>\n\n    <!-- Option part -->\n    <ng-container *ngIf=\"templateOption; else noTemplateOption\">\n      <ng-template ng-option-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"templateOption\" [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateOption>\n      <ng-template ng-option-tmp let-item=\"item\">\n        <span class=\"ng-option-label\">\n          <pry-icon\n            *ngIf=\"bindIcon\"\n            [iconSvg]=\"item[bindIcon]\"\n            [width]=\"iconSize[0]\"\n            [height]=\"iconSize[1]\"\n            [animation]=\"false\"\n          ></pry-icon>\n          <ng-container *ngIf=\"labelTranslate; else noTranslateOption\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFnOption\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFnOption>\n              {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslateOption>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n      </ng-template>\n    </ng-template>\n  </ng-select>\n</ng-container>\n<ng-template #itemAsInput>\n  <ng-select\n    #select\n    class=\"pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindValue\"\n    [bindLabel]=\"bindLabel\"\n    [clearable]=\"clearable\"\n    [searchable]=\"autocomplete\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n  </ng-select>\n</ng-template>\n" }]
+                    ], template: "<ng-container *ngIf=\"itemsAsOption; else itemAsInput\">\n  <ng-select\n    class=\"a-pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindData ? undefined : bindValue\"\n    [bindLabel]=\"bindData ? undefined : bindLabel\"\n    [clearable]=\"clearable\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [searchable]=\"autocomplete\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n    <!-- Label part -->\n    <ng-container *ngIf=\"templateLabel; else noTemplateLabel\">\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <ng-container [ngTemplateOutlet]=\"templateLabel\" [ngTemplateOutletContext]=\"{ item, clear }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateLabel>\n      <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n        <span\n          *ngIf=\"multiple && !multipleClearRight\"\n          class=\"ng-value-icon left\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n        <span class=\"ng-value-label\">\n          <ng-container *ngIf=\"bindIcon\">\n            <pry-icon\n              style=\"margin-right: 0.25em\"\n              [iconSvg]=\"item[bindIcon]\"\n              [width]=\"iconSize[0]\"\n              [height]=\"iconSize[1]\"\n              [animation]=\"false\"\n            ></pry-icon>\n          </ng-container>\n          <ng-container *ngIf=\"labelTranslate; else noTranslate\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFn\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFn>\n              <ng-container *ngIf=\"baseTranslate + (bindData ? item : item?.[bindLabel]) !== 'null'\">\n                {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n              </ng-container>\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslate>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n        <span\n          *ngIf=\"multiple && multipleClearRight\"\n          class=\"ng-value-icon right\"\n          (click)=\"clear(item)\"\n          aria-hidden=\"true\"\n          >\u00D7</span\n        >\n      </ng-template>\n    </ng-template>\n\n    <!-- Option part -->\n    <ng-container *ngIf=\"templateOption; else noTemplateOption\">\n      <ng-template ng-option-tmp let-item=\"item\">\n        <ng-container [ngTemplateOutlet]=\"templateOption\" [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n      </ng-template>\n    </ng-container>\n    <ng-template #noTemplateOption>\n      <ng-template ng-option-tmp let-item=\"item\">\n        <span class=\"ng-option-label\">\n          <pry-icon\n            *ngIf=\"bindIcon\"\n            [iconSvg]=\"item[bindIcon]\"\n            [width]=\"iconSize[0]\"\n            [height]=\"iconSize[1]\"\n            [animation]=\"false\"\n          ></pry-icon>\n          <ng-container *ngIf=\"labelTranslate; else noTranslateOption\">\n            <ng-container *ngIf=\"translationFn; else noTranslationFnOption\">\n              {{ translationFn(bindData ? item : item?.[bindLabel], translationFnArgs) | i18n }}\n            </ng-container>\n            <ng-template #noTranslationFnOption>\n              {{ baseTranslate + (bindData ? item : item?.[bindLabel]) | i18n }}\n            </ng-template>\n          </ng-container>\n          <ng-template #noTranslateOption>\n            {{ bindData ? item : item?.[bindLabel] }}\n          </ng-template>\n        </span>\n      </ng-template>\n    </ng-template>\n  </ng-select>\n</ng-container>\n<ng-template #itemAsInput>\n  <ng-select\n    #select\n    class=\"pry-select\"\n    [class.pry-select-form]=\"isForm\"\n    [multiple]=\"multiple\"\n    [closeOnSelect]=\"closeOnSelect\"\n    [items]=\"items\"\n    [bindValue]=\"bindValue\"\n    [bindLabel]=\"bindLabel\"\n    [clearable]=\"clearable\"\n    [searchable]=\"autocomplete\"\n    [ngModel]=\"value\"\n    (ngModelChange)=\"writeValue($event)\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder!\"\n    [clearAllText]=\"'@pry.filters.clear' | i18n\"\n  >\n  </ng-select>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { labelTranslate: [{
                 type: Input
             }], baseTranslate: [{
@@ -9012,8 +9022,8 @@ class PryAboutComponent {
     }
     displayVersion(value) {
         const backVersion = value;
-        if (!!backVersion.chartVersion) {
-            return `${backVersion.chartVersion}[${backVersion.applicationVersion}]`;
+        if (!!backVersion.applicationVersion) {
+            return `${backVersion.applicationVersion}`;
         }
         const frontVersion = value;
         if (!!frontVersion.libVersion) {
@@ -10736,7 +10746,8 @@ class DashboardEffects {
         this.relaunchAfterOrder$ = createEffect(() => this.actions$.pipe(ofType(DashboardActions.quickOrder), map$1((action) => SearchActions.getDatasourceItems({ id: action.datasourceId }))));
         this.propagateGridLayout$ = createEffect(() => this.actions$.pipe(ofType(DashboardActions.setGridLayout), withLatestFrom(this.store.select(DashboardSelectors.rank), this.store.select(DashboardSelectors.windowManifest)), map$1(([action, rank, windowManifest]) => DashboardActions.propagateGridLayout({ manifest: windowManifest, rank }))));
         this.toggleEditionModeIfNotManual$ = createEffect(() => this.actions$.pipe(ofType(DashboardActions.setGridLayout), filter$1((action) => action.layout !== DashboardGridLayout.MANUAL), map$1(() => DashboardActions.toggleEditionMode({ force: false }))));
-        this.getCapability$ = createEffect(() => this.actions$.pipe(ofType(DashboardActions.getCapability), debounceTime$1(100), withLatestFrom(this.store.select(DashboardSelectors.capabilities)), filter$1(([action, capabilities]) => (!!capabilities && !!action.url && !capabilities[action.url]) || !!action.force), mergeMap$1(([action, _]) => this.wmsService.getCapabilities(action.url).pipe(map$1((capability) => DashboardActions.updateCapability({ url: action.url, capability })), startWith(DashboardActions.updateCapability({ url: action.url, capability: null }))))));
+        this.getCapability$ = createEffect(() => this.actions$.pipe(ofType(DashboardActions.getCapability), withLatestFrom(this.store.select(DashboardSelectors.capabilities)), filter$1(([action, capabilities]) => (!!capabilities && !!action.url && (!capabilities[action.url] || !capabilities[action.url].doc)) ||
+            !!action.force), mergeMap$1(([action, _]) => this.wmsService.getCapabilities(action.url).pipe(map$1((capability) => DashboardActions.updateCapability({ url: action.url, capability })), startWith(DashboardActions.updateCapability({ url: action.url, capability: null }))))));
         this.getWmsFeatures = createEffect(() => this.actions$.pipe(ofType(DashboardActions.getWmsFeatures), mergeMap$1((action) => combineLatest([of(action), this.wmsService.getWmsFeatures(action.url)])), map$1(([action, json]) => {
             return DashboardActions.addWmsFeatures({
                 features: json.features.map((feature) => {
@@ -10749,7 +10760,8 @@ class DashboardEffects {
                             .filter((prop) => !!prop.value)
                     };
                     return result;
-                })
+                }),
+                componentId: action.componentId
             });
         })));
         this.addManifestMetadata = createEffect(() => this.actions$.pipe(ofType(DashboardActions.addManifestMetadata), mergeMap$1((action) => this.manifestService.addMetadata(action.presentationId, action.metadataId, action.value).pipe(map$1(() => DashboardActions.fetchManifestsList()), catchError((error) => {
@@ -10825,7 +10837,7 @@ const dashboardInitialState = {
         },
         editionMode: false
     },
-    wmsFeatures: [],
+    wmsFeatures: {},
     capabilities: {}
 };
 const internalReducer = createReducer(dashboardInitialState, on(DashboardActions.join, (state, action) => ({
@@ -11376,15 +11388,23 @@ const internalReducer = createReducer(dashboardInitialState, on(DashboardActions
             }
         }
     };
-}), on(DashboardActions.getWmsFeatures, DashboardActions.resetWmsFeatures, (state, action) => ({
-    ...state,
-    wmsFeatures: []
-})), on(DashboardActions.addWmsFeatures, (state, action) => {
-    const allFeatures = [...state.wmsFeatures, ...action.features];
-    const deDupedIds = [...new Set(allFeatures.map((feat) => feat.id))];
+}), on(DashboardActions.getWmsFeatures, DashboardActions.resetWmsFeatures, (state, action) => {
+    const features = { ...state.wmsFeatures };
+    delete features[action.componentId];
+    return {
+        ...state,
+        wmsFeatures: features
+    };
+}), on(DashboardActions.addWmsFeatures, (state, action) => {
+    const allComponentFeatures = [...(state.wmsFeatures[action.componentId] ?? []), ...action.features];
+    const deDupedIds = [...new Set(allComponentFeatures.map((feat) => feat.id))];
+    const globalFeatures = {
+        ...state.wmsFeatures,
+        [action.componentId]: deDupedIds.map((id) => allComponentFeatures.find((feat) => feat.id === id))
+    };
     return {
         ...state,
-        wmsFeatures: deDupedIds.map((id) => allFeatures.find((feat) => feat.id === id))
+        wmsFeatures: globalFeatures
     };
 }), on(DashboardActions.fetchStaticManifest, (state, action) => {
     return {