@provoly/dashboard 0.15.3 → 0.15.4

package/fesm2022/provoly-dashboard-search.mjs

@@ -654,11 +654,11 @@ class PrySearchHomeComponent {
         this.subscription.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchHomeComponent, deps: [{ token: i1.Store }, { token: i2$1.Overlay }, { token: i0.ViewContainerRef }, { token: i3.PryDialogService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchHomeComponent, selector: "pry-search-home", inputs: { searchFulltextTpl: "searchFulltextTpl", isMoreList: "isMoreList" }, outputs: { changeListView: "changeListView", changeSearchCriteria: "changeSearchCriteria" }, viewQueries: [{ propertyName: "templateSpot", first: true, predicate: ["templateSpot"], descendants: true, read: TemplateRef }, { propertyName: "templateRefresh", first: true, predicate: ["templateRefresh"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<pry-search-css></pry-search-css>\n<div class=\"o-pry-search-home__named-query\">\n  <ng-container *ngIf=\"namedQueryList$ | async as namedQuery\">\n    <ng-container *ngIf=\"namedQuery.length > 0; else noNamedQuery\">\n      <div class=\"o-pry-search-home__named-query__card\">\n        <pry-expand-panel [open]=\"true\">\n          <pry-expand-panel-title>{{ '@pry.search.home.title' | i18n }}</pry-expand-panel-title>\n\n          <pry-card *ngFor=\"let nq of namedQuery.length > 1 && !isMoreList ? namedQuery.slice(0, 2) : namedQuery\">\n            <pry-card-header [marker]=\"true\">\n              <pry-card-icon>\n                <pry-nq-color-selector [datasource]=\"nq\" [disabled]=\"true\"></pry-nq-color-selector>\n                <img\n                  [alt]=\"nq.id | translateId : { type: 'datasource', output: 'name' } | async\"\n                  [height]=\"22\"\n                  [width]=\"22\"\n                  [src]=\"nq.id | translateId : { type: 'datasource', output: 'icon' } | async\"\n                />\n              </pry-card-icon>\n\n              <pry-card-title>\n                <div\n                  class=\"o-pry-card-title__text\"\n                  [pryTooltip]=\"infoTooltip\"\n                  aria-describedby=\"infoTooltip_searchHome\"\n                >\n                  <div class=\"a-p o-pry-card-title__text__title\">{{ nq.name }}</div>\n                  <div class=\"a-p o-pry-card-title__text__description\" *ngIf=\"nq.description\">{{ nq.description }}</div>\n                </div>\n\n                <ng-template #infoTooltip>\n                  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchHome\">\n                    <span class=\"m-tooltip__text\">\n                      {{ nq.name }}\n                    </span>\n                    <span class=\"m-tooltip__description\" *ngIf=\"nq.description\">\n                      {{ nq.description }}\n                    </span>\n                  </div>\n                </ng-template>\n\n                <pry-icon\n                  class=\"o-pry-card-title__pin\"\n                  *ngIf=\"nq.favorite\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                  aria-label=\"favorite\"\n                  iconSvg=\"epingle\"\n                ></pry-icon>\n\n                <button\n                  [pryTooltip]=\"infoTooltipShow\"\n                  pryTooltipPosition=\"bottom\"\n                  aria-describedby=\"infoTooltipShow_searchHome\"\n                  class=\"a-btn a-btn--secondary -size-sm\"\n                  (click)=\"onSearchNamedQuery(nq.id)\"\n                  *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\"\n                >\n                  {{ '@pry.search.namedQuery.display' | i18n }}\n                  <span class=\"u-visually-hidden\">le widget associ\u00E9 \u00E0 cette recherche</span>\n                </button>\n              </pry-card-title>\n\n              <pry-card-menu>\n                <div class=\"o-pry-card-menu__nav\">\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onFavorite(nq.id, nq.favorite)\"\n                  >\n                    <pry-icon iconSvg=\"epingle\"></pry-icon>\n                    {{ (nq.favorite ? '@pry.search.namedQuery.noFavorite' : '@pry.search.namedQuery.favorite') | i18n }}\n                  </button>\n                  <pry-card-menu (click)=\"refresh(nq.id)\" class=\"refreshbt\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"synchro\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refreshData' | i18n }}\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\">\n                    <button\n                      type=\"button\"\n                      class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                      (click)=\"loadOpened = nq.id; $event.stopPropagation()\"\n                      cdkOverlayOrigin\n                      #triggerLoad=\"cdkOverlayOrigin\"\n                    >\n                      <pry-icon iconSvg=\"file_download\"></pry-icon>\n                      {{ '@pry.search.namedQuery.display' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n\n                    <ng-template\n                      cdkConnectedOverlay\n                      [cdkConnectedOverlayOrigin]=\"triggerLoad\"\n                      [cdkConnectedOverlayOpen]=\"loadOpened === nq.id\"\n                      [cdkConnectedOverlayHasBackdrop]=\"true\"\n                      [cdkConnectedOverlayPositions]=\"[connectedPosition]\"\n                      cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n                      (backdropClick)=\"loadOpened = undefined\"\n                    >\n                      <div class=\"o-draggable-menu -search-home\">\n                        <ul class=\"o-draggable-menu__list\">\n                          <ng-container *ngFor=\"let menu of structure\">\n                            <li class=\"o-draggable-menu__list__item\">\n                              <button class=\"a-btn\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                                <pry-icon [iconSvg]=\"menu.icon\"></pry-icon>\n                                {{ menu.label | i18n }}\n                              </button>\n\n                              <ul class=\"o-draggable-menu__list__submenu\">\n                                <ng-container *ngFor=\"let sub of menu.sub\">\n                                  <li class=\"o-draggable-menu__list__submenu__item\">\n                                    <button class=\"a-btn\" (click)=\"loadWidget(nq.id, sub)\">\n                                      <pry-icon [iconSvg]=\"sub.icon\"></pry-icon>\n                                      {{ sub.label | i18n }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n                              </ul>\n                            </li>\n                          </ng-container>\n                        </ul>\n                      </div>\n                    </ng-template>\n                  </pry-card-menu>\n\n                  <pry-card-menu class=\"o-pry-card-menu__nav__item\">\n                    <pry-nq-color-selector [ngStyle]=\"{ width: '100%' }\" [datasource]=\"nq\"></pry-nq-color-selector>\n                  </pry-card-menu>\n\n                  <pry-card-menu (click)=\"onSpot(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"mode_clic\"></pry-icon>\n                      {{ '@pry.search.namedQuery.spot' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu (click)=\"onRefresh(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"history-line\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refresh.title' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onDelete(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"delete\"></pry-icon>\n                    {{ '@pry.search.namedQuery.delete' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onRename(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"renamed\"></pry-icon>\n                    {{ '@pry.search.namedQuery.rename' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onEdit(nq)\"\n                    (keydown.tab)=\"hideSpot()\"\n                  >\n                    <pry-icon iconSvg=\"edit\"></pry-icon>\n                    {{ '@pry.search.namedQuery.edit' | i18n }}\n                  </button>\n                </div>\n              </pry-card-menu>\n            </pry-card-header>\n          </pry-card>\n        </pry-expand-panel>\n      </div>\n      <button\n        class=\"a-btn -link-like\"\n        aria-pressed=\"false\"\n        id=\"btn_view_more\"\n        *ngIf=\"namedQuery.length > 2\"\n        (click)=\"onChangeListView(isMoreList)\"\n      >\n        {{ isMoreList ? ('@pry.search.namedQuery.seeLess' | i18n) : ('@pry.search.namedQuery.seeMore' | i18n) }}\n      </button>\n    </ng-container>\n\n    <ng-template #noNamedQuery>\n      <p class=\"search-home__container-search\">{{ '@pry.search.namedQuery.emptyNamedQuery' | i18n }}</p>\n    </ng-template>\n  </ng-container>\n</div>\n\n<ng-template #infoTooltipShow>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipShow_searchHome\">\n    <span class=\"m-tooltip__text\"> Afficher le widget associ\u00E9 \u00E0 cette recherche </span>\n  </div>\n</ng-template>\n\n<div class=\"o-pry-search-home__search\">\n  <h3 class=\"a-h3\">{{ '@pry.search.home.ssTitle' | i18n }}</h3>\n  <ng-container *ngIf=\"searchFulltextTpl\">\n    <ng-container [ngTemplateOutlet]=\"searchFulltextTpl\"></ng-container>\n    <p class=\"a-p o-pry-search-home__search__or\">{{ '@pry.search.home.or' | i18n }}</p>\n  </ng-container>\n  <button class=\"a-btn a-btn--primary -width-full\" (click)=\"onSearchCriteria()\">\n    <pry-icon [width]=\"20\" [height]=\"20\" iconSvg=\"search-criteria\"></pry-icon>\n    {{ '@pry.search.home.searchByCriteria' | i18n }}\n    <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n  </button>\n</div>\n\n<ng-template #templateSpot>\n  <div (mouseleave)=\"hideSpot()\">\n    {{\n      ((spottingWidget$ | async)?.length ?? 0 > 0\n        ? '@pry.search.namedQuery.spotTitle'\n        : '@pry.search.namedQuery.noSpot'\n      ) | i18n : { length: (spottingWidget$ | async)?.length }\n    }}\n    <div *ngFor=\"let use of spottingWidget$ | async\" class=\"spot-line\">\n      <pry-icon [width]=\"20\" [height]=\"20\" [iconSvg]=\"icons[use.type]\"></pry-icon>\n      {{ '@pry.search.namedQuery.type.' + use.type | i18n }} - {{ '@pry.search.namedQuery.use' | i18n : use }}\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #templateRefresh>\n  <div>\n    <button\n      *ngFor=\"let option of refreshOptions\"\n      class=\"refresh-line a-btn a-btn--icon-text -size-sm\"\n      (click)=\"selectRefresh(option)\"\n    >\n      <pry-icon\n        [width]=\"20\"\n        [height]=\"20\"\n        iconSvg=\"check\"\n        *ngIf=\"(((refreshRates$ | async) ?? {})[refreshId] ?? 0) === option\"\n      ></pry-icon>\n      {{ '@pry.search.namedQuery.refresh.' + option | i18n }}\n    </button>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.PryNqColorSelectorComponent, selector: "pry-nq-color-selector", inputs: ["disabled", "datasource"], outputs: ["colorChanged"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i2$1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2$1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i3.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: i5.PryExpandPanelComponent, selector: "pry-expand-panel", inputs: ["open"] }, { kind: "directive", type: i5.PryExpansionPanelTitleDirective, selector: "pry-expand-panel-title" }, { kind: "component", type: i6.PryCardComponent, selector: "pry-card", inputs: ["selected"], outputs: ["statusChange"] }, { kind: "directive", type: i6.PryCardIconDirective, selector: "pry-card-icon, [pry-card-icon], [pryCardIcon]" }, { kind: "directive", type: i6.PryCardTitleDirective, selector: "pry-card-title, [o-pry-card-title], [pryCardTitle]" }, { kind: "directive", type: i6.PryCardMenuDirective, selector: "pry-card-menu", outputs: ["closeMenu$"], exportAs: ["pryCardMenu"] }, { kind: "component", type: i6.PryCardHeaderComponent, selector: "pry-card-header", inputs: ["marker"] }, { kind: "component", type: PrySearchCssComponent, selector: "pry-search-css" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchHomeComponent, selector: "pry-search-home", inputs: { searchFulltextTpl: "searchFulltextTpl", isMoreList: "isMoreList" }, outputs: { changeListView: "changeListView", changeSearchCriteria: "changeSearchCriteria" }, viewQueries: [{ propertyName: "templateSpot", first: true, predicate: ["templateSpot"], descendants: true, read: TemplateRef }, { propertyName: "templateRefresh", first: true, predicate: ["templateRefresh"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<pry-search-css></pry-search-css>\n<div class=\"o-pry-search-home__named-query\">\n  <ng-container *ngIf=\"namedQueryList$ | async as namedQuery\">\n    <ng-container *ngIf=\"namedQuery.length > 0; else noNamedQuery\">\n      <div class=\"o-pry-search-home__named-query__card\">\n        <pry-expand-panel [open]=\"true\">\n          <pry-expand-panel-title>{{ '@pry.search.home.title' | i18n }}</pry-expand-panel-title>\n\n          <pry-card *ngFor=\"let nq of namedQuery.length > 1 && !isMoreList ? namedQuery.slice(0, 2) : namedQuery\">\n            <pry-card-header [marker]=\"true\">\n              <pry-card-icon>\n                <pry-nq-color-selector [datasource]=\"nq\" [disabled]=\"true\"></pry-nq-color-selector>\n                <img\n                  [alt]=\"nq.id | translateId : { type: 'datasource', output: 'name' } | async\"\n                  [height]=\"22\"\n                  [width]=\"22\"\n                  [src]=\"nq.id | translateId : { type: 'datasource', output: 'icon' } | async\"\n                />\n              </pry-card-icon>\n\n              <pry-card-title>\n                <div class=\"o-pry-card-title__text\" aria-describedby=\"infoTooltip_searchHome\">\n                  <div class=\"a-p o-pry-card-title__text__title\">{{ nq.name }}</div>\n                  <div class=\"a-p o-pry-card-title__text__description\" *ngIf=\"nq.description\">{{ nq.description }}</div>\n                </div>\n                <ng-template #infoTooltip>\n                  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchHome\">\n                    <span class=\"m-tooltip__text\">\n                      {{ nq.name }}\n                    </span>\n                    <span class=\"m-tooltip__description\" *ngIf=\"nq.description\">\n                      {{ nq.description }}\n                    </span>\n                  </div>\n                </ng-template>\n                <pry-icon\n                  class=\"o-pry-card-title__pin\"\n                  *ngIf=\"nq.favorite\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                  aria-label=\"favorite\"\n                  iconSvg=\"epingle\"\n                ></pry-icon>\n\n                <button\n                  [attr.data-tooltip]=\"'@pry.search.home.showAssociatedWidget' | i18n\"\n                  data-tooltip-position=\"bottom\"\n                  class=\"a-tooltip a-btn a-btn--secondary -size-sm\"\n                  (click)=\"onSearchNamedQuery(nq.id)\"\n                  *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\"\n                >\n                  {{ '@pry.search.namedQuery.display' | i18n }}\n                  <span class=\"u-visually-hidden\">{{ '@pry.search.home.associatedWidget' | i18n }}</span>\n                </button>\n              </pry-card-title>\n\n              <pry-card-menu>\n                <div class=\"o-pry-card-menu__nav\">\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onFavorite(nq.id, nq.favorite)\"\n                  >\n                    <pry-icon iconSvg=\"epingle\"></pry-icon>\n                    {{ (nq.favorite ? '@pry.search.namedQuery.noFavorite' : '@pry.search.namedQuery.favorite') | i18n }}\n                  </button>\n                  <pry-card-menu (click)=\"refresh(nq.id)\" class=\"refreshbt\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"synchro\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refreshData' | i18n }}\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\">\n                    <button\n                      type=\"button\"\n                      class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                      (click)=\"loadOpened = nq.id; $event.stopPropagation()\"\n                      cdkOverlayOrigin\n                      #triggerLoad=\"cdkOverlayOrigin\"\n                    >\n                      <pry-icon iconSvg=\"file_download\"></pry-icon>\n                      {{ '@pry.search.namedQuery.display' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n\n                    <ng-template\n                      cdkConnectedOverlay\n                      [cdkConnectedOverlayOrigin]=\"triggerLoad\"\n                      [cdkConnectedOverlayOpen]=\"loadOpened === nq.id\"\n                      [cdkConnectedOverlayHasBackdrop]=\"true\"\n                      [cdkConnectedOverlayPositions]=\"[connectedPosition]\"\n                      cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n                      (backdropClick)=\"loadOpened = undefined\"\n                    >\n                      <div class=\"o-draggable-menu -search-home\">\n                        <ul class=\"o-draggable-menu__list\">\n                          <ng-container *ngFor=\"let menu of structure\">\n                            <li class=\"o-draggable-menu__list__item\">\n                              <button class=\"a-btn\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                                <pry-icon [iconSvg]=\"menu.icon\"></pry-icon>\n                                {{ menu.label | i18n }}\n                              </button>\n\n                              <ul class=\"o-draggable-menu__list__submenu\">\n                                <ng-container *ngFor=\"let sub of menu.sub\">\n                                  <li class=\"o-draggable-menu__list__submenu__item\">\n                                    <button class=\"a-btn\" (click)=\"loadWidget(nq.id, sub)\">\n                                      <pry-icon [iconSvg]=\"sub.icon\"></pry-icon>\n                                      {{ sub.label | i18n }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n                              </ul>\n                            </li>\n                          </ng-container>\n                        </ul>\n                      </div>\n                    </ng-template>\n                  </pry-card-menu>\n\n                  <pry-card-menu class=\"o-pry-card-menu__nav__item\">\n                    <pry-nq-color-selector [ngStyle]=\"{ width: '100%' }\" [datasource]=\"nq\"></pry-nq-color-selector>\n                  </pry-card-menu>\n\n                  <pry-card-menu (click)=\"onSpot(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"mode_clic\"></pry-icon>\n                      {{ '@pry.search.namedQuery.spot' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu (click)=\"onRefresh(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"history-line\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refresh.title' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onDelete(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"delete\"></pry-icon>\n                    {{ '@pry.search.namedQuery.delete' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onRename(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"renamed\"></pry-icon>\n                    {{ '@pry.search.namedQuery.rename' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onEdit(nq)\"\n                    (keydown.tab)=\"hideSpot()\"\n                  >\n                    <pry-icon iconSvg=\"edit\"></pry-icon>\n                    {{ '@pry.search.namedQuery.edit' | i18n }}\n                  </button>\n                </div>\n              </pry-card-menu>\n            </pry-card-header>\n          </pry-card>\n        </pry-expand-panel>\n      </div>\n      <button\n        class=\"a-btn -link-like\"\n        aria-pressed=\"false\"\n        id=\"btn_view_more\"\n        *ngIf=\"namedQuery.length > 2\"\n        (click)=\"onChangeListView(isMoreList)\"\n      >\n        {{ isMoreList ? ('@pry.search.namedQuery.seeLess' | i18n) : ('@pry.search.namedQuery.seeMore' | i18n) }}\n      </button>\n    </ng-container>\n\n    <ng-template #noNamedQuery>\n      <p class=\"search-home__container-search\">{{ '@pry.search.namedQuery.emptyNamedQuery' | i18n }}</p>\n    </ng-template>\n  </ng-container>\n</div>\n\n<div class=\"o-pry-search-home__search\">\n  <h3 class=\"a-h3\">{{ '@pry.search.home.ssTitle' | i18n }}</h3>\n  <ng-container *ngIf=\"searchFulltextTpl\">\n    <ng-container [ngTemplateOutlet]=\"searchFulltextTpl\"></ng-container>\n    <p class=\"a-p o-pry-search-home__search__or\">{{ '@pry.search.home.or' | i18n }}</p>\n  </ng-container>\n  <button class=\"a-btn a-btn--primary -width-full\" (click)=\"onSearchCriteria()\">\n    <pry-icon [width]=\"20\" [height]=\"20\" iconSvg=\"search-criteria\"></pry-icon>\n    {{ '@pry.search.home.searchByCriteria' | i18n }}\n    <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n  </button>\n</div>\n\n<ng-template #templateSpot>\n  <div (mouseleave)=\"hideSpot()\">\n    {{\n      ((spottingWidget$ | async)?.length ?? 0 > 0\n        ? '@pry.search.namedQuery.spotTitle'\n        : '@pry.search.namedQuery.noSpot'\n      ) | i18n : { length: (spottingWidget$ | async)?.length }\n    }}\n    <div *ngFor=\"let use of spottingWidget$ | async\" class=\"spot-line\">\n      <pry-icon [width]=\"20\" [height]=\"20\" [iconSvg]=\"icons[use.type]\"></pry-icon>\n      {{ '@pry.search.namedQuery.type.' + use.type | i18n }} - {{ '@pry.search.namedQuery.use' | i18n : use }}\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #templateRefresh>\n  <div>\n    <button\n      *ngFor=\"let option of refreshOptions\"\n      class=\"refresh-line a-btn a-btn--icon-text -size-sm\"\n      (click)=\"selectRefresh(option)\"\n    >\n      <pry-icon\n        [width]=\"20\"\n        [height]=\"20\"\n        iconSvg=\"check\"\n        *ngIf=\"(((refreshRates$ | async) ?? {})[refreshId] ?? 0) === option\"\n      ></pry-icon>\n      {{ '@pry.search.namedQuery.refresh.' + option | i18n }}\n    </button>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.PryNqColorSelectorComponent, selector: "pry-nq-color-selector", inputs: ["disabled", "datasource"], outputs: ["colorChanged"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i2$1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i2$1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i5.PryExpandPanelComponent, selector: "pry-expand-panel", inputs: ["open"] }, { kind: "directive", type: i5.PryExpansionPanelTitleDirective, selector: "pry-expand-panel-title" }, { kind: "component", type: i6.PryCardComponent, selector: "pry-card", inputs: ["selected"], outputs: ["statusChange"] }, { kind: "directive", type: i6.PryCardIconDirective, selector: "pry-card-icon, [pry-card-icon], [pryCardIcon]" }, { kind: "directive", type: i6.PryCardTitleDirective, selector: "pry-card-title, [o-pry-card-title], [pryCardTitle]" }, { kind: "directive", type: i6.PryCardMenuDirective, selector: "pry-card-menu", outputs: ["closeMenu$"], exportAs: ["pryCardMenu"] }, { kind: "component", type: i6.PryCardHeaderComponent, selector: "pry-card-header", inputs: ["marker"] }, { kind: "component", type: PrySearchCssComponent, selector: "pry-search-css" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchHomeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-search-home', template: "<pry-search-css></pry-search-css>\n<div class=\"o-pry-search-home__named-query\">\n  <ng-container *ngIf=\"namedQueryList$ | async as namedQuery\">\n    <ng-container *ngIf=\"namedQuery.length > 0; else noNamedQuery\">\n      <div class=\"o-pry-search-home__named-query__card\">\n        <pry-expand-panel [open]=\"true\">\n          <pry-expand-panel-title>{{ '@pry.search.home.title' | i18n }}</pry-expand-panel-title>\n\n          <pry-card *ngFor=\"let nq of namedQuery.length > 1 && !isMoreList ? namedQuery.slice(0, 2) : namedQuery\">\n            <pry-card-header [marker]=\"true\">\n              <pry-card-icon>\n                <pry-nq-color-selector [datasource]=\"nq\" [disabled]=\"true\"></pry-nq-color-selector>\n                <img\n                  [alt]=\"nq.id | translateId : { type: 'datasource', output: 'name' } | async\"\n                  [height]=\"22\"\n                  [width]=\"22\"\n                  [src]=\"nq.id | translateId : { type: 'datasource', output: 'icon' } | async\"\n                />\n              </pry-card-icon>\n\n              <pry-card-title>\n                <div\n                  class=\"o-pry-card-title__text\"\n                  [pryTooltip]=\"infoTooltip\"\n                  aria-describedby=\"infoTooltip_searchHome\"\n                >\n                  <div class=\"a-p o-pry-card-title__text__title\">{{ nq.name }}</div>\n                  <div class=\"a-p o-pry-card-title__text__description\" *ngIf=\"nq.description\">{{ nq.description }}</div>\n                </div>\n\n                <ng-template #infoTooltip>\n                  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchHome\">\n                    <span class=\"m-tooltip__text\">\n                      {{ nq.name }}\n                    </span>\n                    <span class=\"m-tooltip__description\" *ngIf=\"nq.description\">\n                      {{ nq.description }}\n                    </span>\n                  </div>\n                </ng-template>\n\n                <pry-icon\n                  class=\"o-pry-card-title__pin\"\n                  *ngIf=\"nq.favorite\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                  aria-label=\"favorite\"\n                  iconSvg=\"epingle\"\n                ></pry-icon>\n\n                <button\n                  [pryTooltip]=\"infoTooltipShow\"\n                  pryTooltipPosition=\"bottom\"\n                  aria-describedby=\"infoTooltipShow_searchHome\"\n                  class=\"a-btn a-btn--secondary -size-sm\"\n                  (click)=\"onSearchNamedQuery(nq.id)\"\n                  *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\"\n                >\n                  {{ '@pry.search.namedQuery.display' | i18n }}\n                  <span class=\"u-visually-hidden\">le widget associ\u00E9 \u00E0 cette recherche</span>\n                </button>\n              </pry-card-title>\n\n              <pry-card-menu>\n                <div class=\"o-pry-card-menu__nav\">\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onFavorite(nq.id, nq.favorite)\"\n                  >\n                    <pry-icon iconSvg=\"epingle\"></pry-icon>\n                    {{ (nq.favorite ? '@pry.search.namedQuery.noFavorite' : '@pry.search.namedQuery.favorite') | i18n }}\n                  </button>\n                  <pry-card-menu (click)=\"refresh(nq.id)\" class=\"refreshbt\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"synchro\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refreshData' | i18n }}\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\">\n                    <button\n                      type=\"button\"\n                      class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                      (click)=\"loadOpened = nq.id; $event.stopPropagation()\"\n                      cdkOverlayOrigin\n                      #triggerLoad=\"cdkOverlayOrigin\"\n                    >\n                      <pry-icon iconSvg=\"file_download\"></pry-icon>\n                      {{ '@pry.search.namedQuery.display' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n\n                    <ng-template\n                      cdkConnectedOverlay\n                      [cdkConnectedOverlayOrigin]=\"triggerLoad\"\n                      [cdkConnectedOverlayOpen]=\"loadOpened === nq.id\"\n                      [cdkConnectedOverlayHasBackdrop]=\"true\"\n                      [cdkConnectedOverlayPositions]=\"[connectedPosition]\"\n                      cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n                      (backdropClick)=\"loadOpened = undefined\"\n                    >\n                      <div class=\"o-draggable-menu -search-home\">\n                        <ul class=\"o-draggable-menu__list\">\n                          <ng-container *ngFor=\"let menu of structure\">\n                            <li class=\"o-draggable-menu__list__item\">\n                              <button class=\"a-btn\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                                <pry-icon [iconSvg]=\"menu.icon\"></pry-icon>\n                                {{ menu.label | i18n }}\n                              </button>\n\n                              <ul class=\"o-draggable-menu__list__submenu\">\n                                <ng-container *ngFor=\"let sub of menu.sub\">\n                                  <li class=\"o-draggable-menu__list__submenu__item\">\n                                    <button class=\"a-btn\" (click)=\"loadWidget(nq.id, sub)\">\n                                      <pry-icon [iconSvg]=\"sub.icon\"></pry-icon>\n                                      {{ sub.label | i18n }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n                              </ul>\n                            </li>\n                          </ng-container>\n                        </ul>\n                      </div>\n                    </ng-template>\n                  </pry-card-menu>\n\n                  <pry-card-menu class=\"o-pry-card-menu__nav__item\">\n                    <pry-nq-color-selector [ngStyle]=\"{ width: '100%' }\" [datasource]=\"nq\"></pry-nq-color-selector>\n                  </pry-card-menu>\n\n                  <pry-card-menu (click)=\"onSpot(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"mode_clic\"></pry-icon>\n                      {{ '@pry.search.namedQuery.spot' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu (click)=\"onRefresh(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"history-line\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refresh.title' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onDelete(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"delete\"></pry-icon>\n                    {{ '@pry.search.namedQuery.delete' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onRename(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"renamed\"></pry-icon>\n                    {{ '@pry.search.namedQuery.rename' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onEdit(nq)\"\n                    (keydown.tab)=\"hideSpot()\"\n                  >\n                    <pry-icon iconSvg=\"edit\"></pry-icon>\n                    {{ '@pry.search.namedQuery.edit' | i18n }}\n                  </button>\n                </div>\n              </pry-card-menu>\n            </pry-card-header>\n          </pry-card>\n        </pry-expand-panel>\n      </div>\n      <button\n        class=\"a-btn -link-like\"\n        aria-pressed=\"false\"\n        id=\"btn_view_more\"\n        *ngIf=\"namedQuery.length > 2\"\n        (click)=\"onChangeListView(isMoreList)\"\n      >\n        {{ isMoreList ? ('@pry.search.namedQuery.seeLess' | i18n) : ('@pry.search.namedQuery.seeMore' | i18n) }}\n      </button>\n    </ng-container>\n\n    <ng-template #noNamedQuery>\n      <p class=\"search-home__container-search\">{{ '@pry.search.namedQuery.emptyNamedQuery' | i18n }}</p>\n    </ng-template>\n  </ng-container>\n</div>\n\n<ng-template #infoTooltipShow>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipShow_searchHome\">\n    <span class=\"m-tooltip__text\"> Afficher le widget associ\u00E9 \u00E0 cette recherche </span>\n  </div>\n</ng-template>\n\n<div class=\"o-pry-search-home__search\">\n  <h3 class=\"a-h3\">{{ '@pry.search.home.ssTitle' | i18n }}</h3>\n  <ng-container *ngIf=\"searchFulltextTpl\">\n    <ng-container [ngTemplateOutlet]=\"searchFulltextTpl\"></ng-container>\n    <p class=\"a-p o-pry-search-home__search__or\">{{ '@pry.search.home.or' | i18n }}</p>\n  </ng-container>\n  <button class=\"a-btn a-btn--primary -width-full\" (click)=\"onSearchCriteria()\">\n    <pry-icon [width]=\"20\" [height]=\"20\" iconSvg=\"search-criteria\"></pry-icon>\n    {{ '@pry.search.home.searchByCriteria' | i18n }}\n    <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n  </button>\n</div>\n\n<ng-template #templateSpot>\n  <div (mouseleave)=\"hideSpot()\">\n    {{\n      ((spottingWidget$ | async)?.length ?? 0 > 0\n        ? '@pry.search.namedQuery.spotTitle'\n        : '@pry.search.namedQuery.noSpot'\n      ) | i18n : { length: (spottingWidget$ | async)?.length }\n    }}\n    <div *ngFor=\"let use of spottingWidget$ | async\" class=\"spot-line\">\n      <pry-icon [width]=\"20\" [height]=\"20\" [iconSvg]=\"icons[use.type]\"></pry-icon>\n      {{ '@pry.search.namedQuery.type.' + use.type | i18n }} - {{ '@pry.search.namedQuery.use' | i18n : use }}\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #templateRefresh>\n  <div>\n    <button\n      *ngFor=\"let option of refreshOptions\"\n      class=\"refresh-line a-btn a-btn--icon-text -size-sm\"\n      (click)=\"selectRefresh(option)\"\n    >\n      <pry-icon\n        [width]=\"20\"\n        [height]=\"20\"\n        iconSvg=\"check\"\n        *ngIf=\"(((refreshRates$ | async) ?? {})[refreshId] ?? 0) === option\"\n      ></pry-icon>\n      {{ '@pry.search.namedQuery.refresh.' + option | i18n }}\n    </button>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pry-search-home', template: "<pry-search-css></pry-search-css>\n<div class=\"o-pry-search-home__named-query\">\n  <ng-container *ngIf=\"namedQueryList$ | async as namedQuery\">\n    <ng-container *ngIf=\"namedQuery.length > 0; else noNamedQuery\">\n      <div class=\"o-pry-search-home__named-query__card\">\n        <pry-expand-panel [open]=\"true\">\n          <pry-expand-panel-title>{{ '@pry.search.home.title' | i18n }}</pry-expand-panel-title>\n\n          <pry-card *ngFor=\"let nq of namedQuery.length > 1 && !isMoreList ? namedQuery.slice(0, 2) : namedQuery\">\n            <pry-card-header [marker]=\"true\">\n              <pry-card-icon>\n                <pry-nq-color-selector [datasource]=\"nq\" [disabled]=\"true\"></pry-nq-color-selector>\n                <img\n                  [alt]=\"nq.id | translateId : { type: 'datasource', output: 'name' } | async\"\n                  [height]=\"22\"\n                  [width]=\"22\"\n                  [src]=\"nq.id | translateId : { type: 'datasource', output: 'icon' } | async\"\n                />\n              </pry-card-icon>\n\n              <pry-card-title>\n                <div class=\"o-pry-card-title__text\" aria-describedby=\"infoTooltip_searchHome\">\n                  <div class=\"a-p o-pry-card-title__text__title\">{{ nq.name }}</div>\n                  <div class=\"a-p o-pry-card-title__text__description\" *ngIf=\"nq.description\">{{ nq.description }}</div>\n                </div>\n                <ng-template #infoTooltip>\n                  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchHome\">\n                    <span class=\"m-tooltip__text\">\n                      {{ nq.name }}\n                    </span>\n                    <span class=\"m-tooltip__description\" *ngIf=\"nq.description\">\n                      {{ nq.description }}\n                    </span>\n                  </div>\n                </ng-template>\n                <pry-icon\n                  class=\"o-pry-card-title__pin\"\n                  *ngIf=\"nq.favorite\"\n                  [width]=\"18\"\n                  [height]=\"18\"\n                  aria-label=\"favorite\"\n                  iconSvg=\"epingle\"\n                ></pry-icon>\n\n                <button\n                  [attr.data-tooltip]=\"'@pry.search.home.showAssociatedWidget' | i18n\"\n                  data-tooltip-position=\"bottom\"\n                  class=\"a-tooltip a-btn a-btn--secondary -size-sm\"\n                  (click)=\"onSearchNamedQuery(nq.id)\"\n                  *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\"\n                >\n                  {{ '@pry.search.namedQuery.display' | i18n }}\n                  <span class=\"u-visually-hidden\">{{ '@pry.search.home.associatedWidget' | i18n }}</span>\n                </button>\n              </pry-card-title>\n\n              <pry-card-menu>\n                <div class=\"o-pry-card-menu__nav\">\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onFavorite(nq.id, nq.favorite)\"\n                  >\n                    <pry-icon iconSvg=\"epingle\"></pry-icon>\n                    {{ (nq.favorite ? '@pry.search.namedQuery.noFavorite' : '@pry.search.namedQuery.favorite') | i18n }}\n                  </button>\n                  <pry-card-menu (click)=\"refresh(nq.id)\" class=\"refreshbt\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"synchro\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refreshData' | i18n }}\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu *ngIf=\"(layout$ | async) !== DashboardGridLayout.MANUAL\">\n                    <button\n                      type=\"button\"\n                      class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                      (click)=\"loadOpened = nq.id; $event.stopPropagation()\"\n                      cdkOverlayOrigin\n                      #triggerLoad=\"cdkOverlayOrigin\"\n                    >\n                      <pry-icon iconSvg=\"file_download\"></pry-icon>\n                      {{ '@pry.search.namedQuery.display' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n\n                    <ng-template\n                      cdkConnectedOverlay\n                      [cdkConnectedOverlayOrigin]=\"triggerLoad\"\n                      [cdkConnectedOverlayOpen]=\"loadOpened === nq.id\"\n                      [cdkConnectedOverlayHasBackdrop]=\"true\"\n                      [cdkConnectedOverlayPositions]=\"[connectedPosition]\"\n                      cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n                      (backdropClick)=\"loadOpened = undefined\"\n                    >\n                      <div class=\"o-draggable-menu -search-home\">\n                        <ul class=\"o-draggable-menu__list\">\n                          <ng-container *ngFor=\"let menu of structure\">\n                            <li class=\"o-draggable-menu__list__item\">\n                              <button class=\"a-btn\" aria-haspopup=\"true\" aria-expanded=\"false\">\n                                <pry-icon [iconSvg]=\"menu.icon\"></pry-icon>\n                                {{ menu.label | i18n }}\n                              </button>\n\n                              <ul class=\"o-draggable-menu__list__submenu\">\n                                <ng-container *ngFor=\"let sub of menu.sub\">\n                                  <li class=\"o-draggable-menu__list__submenu__item\">\n                                    <button class=\"a-btn\" (click)=\"loadWidget(nq.id, sub)\">\n                                      <pry-icon [iconSvg]=\"sub.icon\"></pry-icon>\n                                      {{ sub.label | i18n }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n                              </ul>\n                            </li>\n                          </ng-container>\n                        </ul>\n                      </div>\n                    </ng-template>\n                  </pry-card-menu>\n\n                  <pry-card-menu class=\"o-pry-card-menu__nav__item\">\n                    <pry-nq-color-selector [ngStyle]=\"{ width: '100%' }\" [datasource]=\"nq\"></pry-nq-color-selector>\n                  </pry-card-menu>\n\n                  <pry-card-menu (click)=\"onSpot(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"mode_clic\"></pry-icon>\n                      {{ '@pry.search.namedQuery.spot' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <pry-card-menu (click)=\"onRefresh(nq.id, $event)\">\n                    <button type=\"button\" class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\">\n                      <pry-icon iconSvg=\"history-line\"></pry-icon>\n                      {{ '@pry.search.namedQuery.refresh.title' | i18n }}\n                      <pry-icon\n                        iconSvg=\"fleche_haut\"\n                        [ngStyle]=\"{ transform: 'rotate(90deg)', marginLeft: 'auto' }\"\n                      ></pry-icon>\n                    </button>\n                  </pry-card-menu>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onDelete(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"delete\"></pry-icon>\n                    {{ '@pry.search.namedQuery.delete' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onRename(nq)\"\n                    *ngIf=\"nq.owner\"\n                  >\n                    <pry-icon iconSvg=\"renamed\"></pry-icon>\n                    {{ '@pry.search.namedQuery.rename' | i18n }}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn--icon-text o-pry-card-menu__nav__item\"\n                    (click)=\"onEdit(nq)\"\n                    (keydown.tab)=\"hideSpot()\"\n                  >\n                    <pry-icon iconSvg=\"edit\"></pry-icon>\n                    {{ '@pry.search.namedQuery.edit' | i18n }}\n                  </button>\n                </div>\n              </pry-card-menu>\n            </pry-card-header>\n          </pry-card>\n        </pry-expand-panel>\n      </div>\n      <button\n        class=\"a-btn -link-like\"\n        aria-pressed=\"false\"\n        id=\"btn_view_more\"\n        *ngIf=\"namedQuery.length > 2\"\n        (click)=\"onChangeListView(isMoreList)\"\n      >\n        {{ isMoreList ? ('@pry.search.namedQuery.seeLess' | i18n) : ('@pry.search.namedQuery.seeMore' | i18n) }}\n      </button>\n    </ng-container>\n\n    <ng-template #noNamedQuery>\n      <p class=\"search-home__container-search\">{{ '@pry.search.namedQuery.emptyNamedQuery' | i18n }}</p>\n    </ng-template>\n  </ng-container>\n</div>\n\n<div class=\"o-pry-search-home__search\">\n  <h3 class=\"a-h3\">{{ '@pry.search.home.ssTitle' | i18n }}</h3>\n  <ng-container *ngIf=\"searchFulltextTpl\">\n    <ng-container [ngTemplateOutlet]=\"searchFulltextTpl\"></ng-container>\n    <p class=\"a-p o-pry-search-home__search__or\">{{ '@pry.search.home.or' | i18n }}</p>\n  </ng-container>\n  <button class=\"a-btn a-btn--primary -width-full\" (click)=\"onSearchCriteria()\">\n    <pry-icon [width]=\"20\" [height]=\"20\" iconSvg=\"search-criteria\"></pry-icon>\n    {{ '@pry.search.home.searchByCriteria' | i18n }}\n    <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n  </button>\n</div>\n\n<ng-template #templateSpot>\n  <div (mouseleave)=\"hideSpot()\">\n    {{\n      ((spottingWidget$ | async)?.length ?? 0 > 0\n        ? '@pry.search.namedQuery.spotTitle'\n        : '@pry.search.namedQuery.noSpot'\n      ) | i18n : { length: (spottingWidget$ | async)?.length }\n    }}\n    <div *ngFor=\"let use of spottingWidget$ | async\" class=\"spot-line\">\n      <pry-icon [width]=\"20\" [height]=\"20\" [iconSvg]=\"icons[use.type]\"></pry-icon>\n      {{ '@pry.search.namedQuery.type.' + use.type | i18n }} - {{ '@pry.search.namedQuery.use' | i18n : use }}\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #templateRefresh>\n  <div>\n    <button\n      *ngFor=\"let option of refreshOptions\"\n      class=\"refresh-line a-btn a-btn--icon-text -size-sm\"\n      (click)=\"selectRefresh(option)\"\n    >\n      <pry-icon\n        [width]=\"20\"\n        [height]=\"20\"\n        iconSvg=\"check\"\n        *ngIf=\"(((refreshRates$ | async) ?? {})[refreshId] ?? 0) === option\"\n      ></pry-icon>\n      {{ '@pry.search.namedQuery.refresh.' + option | i18n }}\n    </button>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }, { type: i2$1.Overlay }, { type: i0.ViewContainerRef }, { type: i3.PryDialogService }]; }, propDecorators: { templateSpot: [{
                 type: ViewChild,
                 args: ['templateSpot', { read: TemplateRef }]
@@ -1268,15 +1268,18 @@ class MultiClassConditionComponent {
             }));
         }
     }
+    join(classes) {
+        return classes.map((clazz) => clazz.name).join(', ');
+    }
     get hasTwoFields() {
         return this.form.get('operator')?.value === 'INSIDE' || this.form.get('operator')?.value === 'OUTSIDE';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MultiClassConditionComponent, deps: [{ token: i1.Store }, { token: SearchMultiClassService }, { token: i2$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: MultiClassConditionComponent, selector: "pry-multi-class-condition", inputs: { id: "id" }, viewQueries: [{ propertyName: "fieldSelectionTpl", first: true, predicate: ["fieldSelectionTpl"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"condition$ | async as condition\">\n  <div class=\"o-multi-class-condition\">\n    <div class=\"o-multi-class-condition__content\">\n      <div class=\"o-multi-class-condition__content__action\">\n        <button\n          type=\"button\"\n          class=\"a-btn a-btn--primary -size-sm -width-full\"\n          aria-label=\"selection button\"\n          (click)=\"toggleFieldSelection()\"\n        >\n          <ng-container *ngIf=\"field$ | async as field; else noFieldTpl\">\n            {{ field.name }}\n          </ng-container>\n          <ng-template #noFieldTpl>{{ '@pry.search.multi.selectField' | i18n }}</ng-template>\n        </button>\n\n        <ng-container *ngIf=\"classesLinked$ | async as classesLinked\">\n          <pry-icon\n            iconSvg=\"links_line\"\n            [width]=\"15\"\n            [height]=\"15\"\n            style=\"color: black\"\n            [pryTooltip]=\"classesTooltip\"\n            pryTooltipPosition=\"after\"\n          ></pry-icon>\n          <ng-template #classesTooltip>\n            <span>\n              {{ '@pry.search.multi.in' | i18n }}\n              <span *ngFor=\"let clazz of classesLinked; let last = last\">\n                {{ clazz.name }}\n                <ng-container *ngIf=\"!last\">, </ng-container>\n              </span>\n            </span>\n          </ng-template>\n        </ng-container>\n      </div>\n\n      <ng-container [formGroup]=\"form\">\n        <div class=\"m-form-label-field\">\n          <pry-select\n            [items]=\"operators$ | async\"\n            placeholder=\"Op\u00E9rateur\"\n            formControlName=\"operator\"\n            [itemsAsOption]=\"true\"\n            [labelTranslate]=\"true\"\n            bindValue=\"operator\"\n            bindLabel=\"translation\"\n            class=\"a-pry-select\"\n          ></pry-select>\n        </div>\n        <div class=\"m-form-label-field\">\n          <ng-container *ngIf=\"condition.isDate; else classicInput\">\n            <pry-date-picker\n              formControlName=\"value\"\n              (click)=\"onUpdateValue(condition)\"\n              [rangePicker]=\"hasTwoFields\"\n              [roundSelection]=\"true\"\n              [timePicker]=\"true\"\n            ></pry-date-picker>\n          </ng-container>\n          <ng-template #classicInput>\n            <input\n              type=\"text\"\n              class=\"a-form-field\"\n              [placeholder]=\"\n                (hasTwoFields ? '@pry.search.placeholder.minValue' : '@pry.search.placeholder.search') | i18n\n              \"\n              formControlName=\"value\"\n              (focusout)=\"onUpdateValue(condition)\"\n            />\n            <ng-container *ngIf=\"hasTwoFields\">\n              <input\n                type=\"text\"\n                class=\"a-form-field\"\n                [placeholder]=\"'@pry.search.placeholder.maxValue' | i18n\"\n                formControlName=\"upperValue\"\n                (focusout)=\"onUpdateValue(condition)\"\n              />\n            </ng-container>\n          </ng-template>\n\n          <label class=\"a-label a-label--help -error\" *ngIf=\"formValue?.errors?.['required'] && formValue?.touched\">\n            {{ '@pry.search.multi.requiredError' | i18n }}\n          </label>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"o-multi-class-condition__delete-content\">\n      <ng-container *ngIf=\"notLastCondition$ | async; else cannotDelete\">\n        <button type=\"button\" class=\"a-btn a-btn--icon-only\">\n          <pry-icon\n            iconSvg=\"delete\"\n            [height]=\"20\"\n            [width]=\"20\"\n            [animation]=\"false\"\n            (click)=\"onRemoveCondition(condition)\"\n          ></pry-icon>\n          <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n        </button>\n      </ng-container>\n    </div>\n    <ng-template #cannotDelete>\n      <button type=\"button\" class=\"a-btn a-btn--icon-only\" disabled>\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"delete\"></pry-icon>\n        <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n      </button>\n    </ng-template>\n  </div>\n\n  <ng-template #fieldSelectionTpl>\n    <pry-multi-class-field-selection\n      [conditionId]=\"condition.id\"\n      (closeModal)=\"onCloseModal()\"\n      (selectFieldChange)=\"onChangeField(condition, $event)\"\n    ></pry-multi-class-field-selection>\n  </ng-template>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "directive", type: i3.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: i3.PryDatePickerComponent, selector: "pry-date-picker", inputs: ["rangePicker", "timePicker", "maxYear", "minYear", "roundSelection"] }, { kind: "component", type: MultiClassFieldSelectionComponent, selector: "pry-multi-class-field-selection", inputs: ["conditionId"], outputs: ["closeModal", "selectFieldChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: MultiClassConditionComponent, selector: "pry-multi-class-condition", inputs: { id: "id" }, viewQueries: [{ propertyName: "fieldSelectionTpl", first: true, predicate: ["fieldSelectionTpl"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"condition$ | async as condition\">\n  <div class=\"o-multi-class-condition\">\n    <div class=\"o-multi-class-condition__content\">\n      <div class=\"o-multi-class-condition__content__action\">\n        <button\n          type=\"button\"\n          class=\"a-btn a-btn--primary -size-sm -width-full\"\n          aria-label=\"selection button\"\n          (click)=\"toggleFieldSelection()\"\n        >\n          <ng-container *ngIf=\"field$ | async as field; else noFieldTpl\">\n            {{ field.name }}\n          </ng-container>\n          <ng-template #noFieldTpl>{{ '@pry.search.multi.selectField' | i18n }}</ng-template>\n        </button>\n\n        <ng-container *ngIf=\"classesLinked$ | async as classesLinked\">\n          <pry-icon\n            iconSvg=\"links_line\"\n            [width]=\"15\"\n            [height]=\"15\"\n            style=\"color: black\"\n            [attr.data-tooltip]=\"('@pry.search.multi.in' | i18n) + ' ' + join(classesLinked)\"\n          ></pry-icon>\n        </ng-container>\n      </div>\n\n      <ng-container [formGroup]=\"form\">\n        <div class=\"m-form-label-field\">\n          <pry-select\n            [items]=\"operators$ | async\"\n            placeholder=\"Op\u00E9rateur\"\n            formControlName=\"operator\"\n            [itemsAsOption]=\"true\"\n            [labelTranslate]=\"true\"\n            bindValue=\"operator\"\n            bindLabel=\"translation\"\n            class=\"a-pry-select\"\n          ></pry-select>\n        </div>\n        <div class=\"m-form-label-field\">\n          <ng-container *ngIf=\"condition.isDate; else classicInput\">\n            <pry-date-picker\n              formControlName=\"value\"\n              (click)=\"onUpdateValue(condition)\"\n              [rangePicker]=\"hasTwoFields\"\n              [roundSelection]=\"true\"\n              [timePicker]=\"true\"\n            ></pry-date-picker>\n          </ng-container>\n          <ng-template #classicInput>\n            <input\n              type=\"text\"\n              class=\"a-form-field\"\n              [placeholder]=\"\n                (hasTwoFields ? '@pry.search.placeholder.minValue' : '@pry.search.placeholder.search') | i18n\n              \"\n              formControlName=\"value\"\n              (focusout)=\"onUpdateValue(condition)\"\n            />\n            <ng-container *ngIf=\"hasTwoFields\">\n              <input\n                type=\"text\"\n                class=\"a-form-field\"\n                [placeholder]=\"'@pry.search.placeholder.maxValue' | i18n\"\n                formControlName=\"upperValue\"\n                (focusout)=\"onUpdateValue(condition)\"\n              />\n            </ng-container>\n          </ng-template>\n\n          <label class=\"a-label a-label--help -error\" *ngIf=\"formValue?.errors?.['required'] && formValue?.touched\">\n            {{ '@pry.search.multi.requiredError' | i18n }}\n          </label>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"o-multi-class-condition__delete-content\">\n      <ng-container *ngIf=\"notLastCondition$ | async; else cannotDelete\">\n        <button type=\"button\" class=\"a-btn a-btn--icon-only\">\n          <pry-icon\n            iconSvg=\"delete\"\n            [height]=\"20\"\n            [width]=\"20\"\n            [animation]=\"false\"\n            (click)=\"onRemoveCondition(condition)\"\n          ></pry-icon>\n          <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n        </button>\n      </ng-container>\n    </div>\n    <ng-template #cannotDelete>\n      <button type=\"button\" class=\"a-btn a-btn--icon-only\" disabled>\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"delete\"></pry-icon>\n        <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n      </button>\n    </ng-template>\n  </div>\n\n  <ng-template #fieldSelectionTpl>\n    <pry-multi-class-field-selection\n      [conditionId]=\"condition.id\"\n      (closeModal)=\"onCloseModal()\"\n      (selectFieldChange)=\"onChangeField(condition, $event)\"\n    ></pry-multi-class-field-selection>\n  </ng-template>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i3.PryDatePickerComponent, selector: "pry-date-picker", inputs: ["rangePicker", "timePicker", "maxYear", "minYear", "roundSelection"] }, { kind: "component", type: MultiClassFieldSelectionComponent, selector: "pry-multi-class-field-selection", inputs: ["conditionId"], outputs: ["closeModal", "selectFieldChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: MultiClassConditionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-multi-class-condition', template: "<ng-container *ngIf=\"condition$ | async as condition\">\n  <div class=\"o-multi-class-condition\">\n    <div class=\"o-multi-class-condition__content\">\n      <div class=\"o-multi-class-condition__content__action\">\n        <button\n          type=\"button\"\n          class=\"a-btn a-btn--primary -size-sm -width-full\"\n          aria-label=\"selection button\"\n          (click)=\"toggleFieldSelection()\"\n        >\n          <ng-container *ngIf=\"field$ | async as field; else noFieldTpl\">\n            {{ field.name }}\n          </ng-container>\n          <ng-template #noFieldTpl>{{ '@pry.search.multi.selectField' | i18n }}</ng-template>\n        </button>\n\n        <ng-container *ngIf=\"classesLinked$ | async as classesLinked\">\n          <pry-icon\n            iconSvg=\"links_line\"\n            [width]=\"15\"\n            [height]=\"15\"\n            style=\"color: black\"\n            [pryTooltip]=\"classesTooltip\"\n            pryTooltipPosition=\"after\"\n          ></pry-icon>\n          <ng-template #classesTooltip>\n            <span>\n              {{ '@pry.search.multi.in' | i18n }}\n              <span *ngFor=\"let clazz of classesLinked; let last = last\">\n                {{ clazz.name }}\n                <ng-container *ngIf=\"!last\">, </ng-container>\n              </span>\n            </span>\n          </ng-template>\n        </ng-container>\n      </div>\n\n      <ng-container [formGroup]=\"form\">\n        <div class=\"m-form-label-field\">\n          <pry-select\n            [items]=\"operators$ | async\"\n            placeholder=\"Op\u00E9rateur\"\n            formControlName=\"operator\"\n            [itemsAsOption]=\"true\"\n            [labelTranslate]=\"true\"\n            bindValue=\"operator\"\n            bindLabel=\"translation\"\n            class=\"a-pry-select\"\n          ></pry-select>\n        </div>\n        <div class=\"m-form-label-field\">\n          <ng-container *ngIf=\"condition.isDate; else classicInput\">\n            <pry-date-picker\n              formControlName=\"value\"\n              (click)=\"onUpdateValue(condition)\"\n              [rangePicker]=\"hasTwoFields\"\n              [roundSelection]=\"true\"\n              [timePicker]=\"true\"\n            ></pry-date-picker>\n          </ng-container>\n          <ng-template #classicInput>\n            <input\n              type=\"text\"\n              class=\"a-form-field\"\n              [placeholder]=\"\n                (hasTwoFields ? '@pry.search.placeholder.minValue' : '@pry.search.placeholder.search') | i18n\n              \"\n              formControlName=\"value\"\n              (focusout)=\"onUpdateValue(condition)\"\n            />\n            <ng-container *ngIf=\"hasTwoFields\">\n              <input\n                type=\"text\"\n                class=\"a-form-field\"\n                [placeholder]=\"'@pry.search.placeholder.maxValue' | i18n\"\n                formControlName=\"upperValue\"\n                (focusout)=\"onUpdateValue(condition)\"\n              />\n            </ng-container>\n          </ng-template>\n\n          <label class=\"a-label a-label--help -error\" *ngIf=\"formValue?.errors?.['required'] && formValue?.touched\">\n            {{ '@pry.search.multi.requiredError' | i18n }}\n          </label>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"o-multi-class-condition__delete-content\">\n      <ng-container *ngIf=\"notLastCondition$ | async; else cannotDelete\">\n        <button type=\"button\" class=\"a-btn a-btn--icon-only\">\n          <pry-icon\n            iconSvg=\"delete\"\n            [height]=\"20\"\n            [width]=\"20\"\n            [animation]=\"false\"\n            (click)=\"onRemoveCondition(condition)\"\n          ></pry-icon>\n          <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n        </button>\n      </ng-container>\n    </div>\n    <ng-template #cannotDelete>\n      <button type=\"button\" class=\"a-btn a-btn--icon-only\" disabled>\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"delete\"></pry-icon>\n        <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n      </button>\n    </ng-template>\n  </div>\n\n  <ng-template #fieldSelectionTpl>\n    <pry-multi-class-field-selection\n      [conditionId]=\"condition.id\"\n      (closeModal)=\"onCloseModal()\"\n      (selectFieldChange)=\"onChangeField(condition, $event)\"\n    ></pry-multi-class-field-selection>\n  </ng-template>\n</ng-container>\n" }]
+            args: [{ selector: 'pry-multi-class-condition', template: "<ng-container *ngIf=\"condition$ | async as condition\">\n  <div class=\"o-multi-class-condition\">\n    <div class=\"o-multi-class-condition__content\">\n      <div class=\"o-multi-class-condition__content__action\">\n        <button\n          type=\"button\"\n          class=\"a-btn a-btn--primary -size-sm -width-full\"\n          aria-label=\"selection button\"\n          (click)=\"toggleFieldSelection()\"\n        >\n          <ng-container *ngIf=\"field$ | async as field; else noFieldTpl\">\n            {{ field.name }}\n          </ng-container>\n          <ng-template #noFieldTpl>{{ '@pry.search.multi.selectField' | i18n }}</ng-template>\n        </button>\n\n        <ng-container *ngIf=\"classesLinked$ | async as classesLinked\">\n          <pry-icon\n            iconSvg=\"links_line\"\n            [width]=\"15\"\n            [height]=\"15\"\n            style=\"color: black\"\n            [attr.data-tooltip]=\"('@pry.search.multi.in' | i18n) + ' ' + join(classesLinked)\"\n          ></pry-icon>\n        </ng-container>\n      </div>\n\n      <ng-container [formGroup]=\"form\">\n        <div class=\"m-form-label-field\">\n          <pry-select\n            [items]=\"operators$ | async\"\n            placeholder=\"Op\u00E9rateur\"\n            formControlName=\"operator\"\n            [itemsAsOption]=\"true\"\n            [labelTranslate]=\"true\"\n            bindValue=\"operator\"\n            bindLabel=\"translation\"\n            class=\"a-pry-select\"\n          ></pry-select>\n        </div>\n        <div class=\"m-form-label-field\">\n          <ng-container *ngIf=\"condition.isDate; else classicInput\">\n            <pry-date-picker\n              formControlName=\"value\"\n              (click)=\"onUpdateValue(condition)\"\n              [rangePicker]=\"hasTwoFields\"\n              [roundSelection]=\"true\"\n              [timePicker]=\"true\"\n            ></pry-date-picker>\n          </ng-container>\n          <ng-template #classicInput>\n            <input\n              type=\"text\"\n              class=\"a-form-field\"\n              [placeholder]=\"\n                (hasTwoFields ? '@pry.search.placeholder.minValue' : '@pry.search.placeholder.search') | i18n\n              \"\n              formControlName=\"value\"\n              (focusout)=\"onUpdateValue(condition)\"\n            />\n            <ng-container *ngIf=\"hasTwoFields\">\n              <input\n                type=\"text\"\n                class=\"a-form-field\"\n                [placeholder]=\"'@pry.search.placeholder.maxValue' | i18n\"\n                formControlName=\"upperValue\"\n                (focusout)=\"onUpdateValue(condition)\"\n              />\n            </ng-container>\n          </ng-template>\n\n          <label class=\"a-label a-label--help -error\" *ngIf=\"formValue?.errors?.['required'] && formValue?.touched\">\n            {{ '@pry.search.multi.requiredError' | i18n }}\n          </label>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"o-multi-class-condition__delete-content\">\n      <ng-container *ngIf=\"notLastCondition$ | async; else cannotDelete\">\n        <button type=\"button\" class=\"a-btn a-btn--icon-only\">\n          <pry-icon\n            iconSvg=\"delete\"\n            [height]=\"20\"\n            [width]=\"20\"\n            [animation]=\"false\"\n            (click)=\"onRemoveCondition(condition)\"\n          ></pry-icon>\n          <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n        </button>\n      </ng-container>\n    </div>\n    <ng-template #cannotDelete>\n      <button type=\"button\" class=\"a-btn a-btn--icon-only\" disabled>\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"delete\"></pry-icon>\n        <span class=\"u-visually-hidden\">{{ '@pry.action.delete' | i18n }}</span>\n      </button>\n    </ng-template>\n  </div>\n\n  <ng-template #fieldSelectionTpl>\n    <pry-multi-class-field-selection\n      [conditionId]=\"condition.id\"\n      (closeModal)=\"onCloseModal()\"\n      (selectFieldChange)=\"onChangeField(condition, $event)\"\n    ></pry-multi-class-field-selection>\n  </ng-template>\n</ng-container>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }, { type: SearchMultiClassService }, { type: i2$1.Overlay }, { type: i0.ViewContainerRef }]; }, propDecorators: { fieldSelectionTpl: [{
                 type: ViewChild,
                 args: ['fieldSelectionTpl', { read: TemplateRef }]
@@ -1304,11 +1307,11 @@ class PrySearchMultiClassComponent {
         this.store.dispatch(SearchMultiClassActions.updateMultiType({ multiType }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchMultiClassComponent, deps: [{ token: i1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchMultiClassComponent, selector: "pry-search-multi-class", ngImport: i0, template: "<div class=\"o-search-multi-class\">\n  <div class=\"o-search-multi-class__header\">\n    <h3 class=\"a-h3\">{{ '@pry.search.multi.title' | i18n }}</h3>\n    <div class=\"\" [pryOverlay]=\"optionOverlay\" [(overlayOpen)]=\"optionsOpen\" (click)=\"optionsOpen = !optionsOpen\">\n      <button\n        class=\"a-btn a-btn--icon-text\"\n        [pryTooltip]=\"infoTooltip\"\n        pryTooltipPosition=\"bottom\"\n        aria-describedby=\"infoTooltip_searchMulticlass\"\n      >\n        {{ '@pry.search.multi.options' | i18n }}\n        <pry-icon iconSvg=\"tune\" [width]=\"16\" [height]=\"16\" [animation]=\"false\"></pry-icon>\n      </button>\n    </div>\n    <ng-template #optionOverlay>\n      <div class=\"o-search-multi-class__options\">\n        <pry-toggle\n          [ngModel]=\"(multiType$ | async) === 'OR'\"\n          [leftword]=\"'@pry.search.type.or' | i18n\"\n          [rightword]=\"'@pry.search.type.and' | i18n\"\n          [alwaysActive]=\"true\"\n          (ngModelChange)=\"onChangeMultiType($event)\"\n          >{{ '@pry.search.multi.multiType' | i18n }}</pry-toggle\n        >\n      </div>\n    </ng-template>\n  </div>\n\n  <div class=\"o-search-multi-class__conditions-wrapper\">\n    <div class=\"o-search-multi-class__conditions\">\n      <ng-container *ngFor=\"let condition of conditions$ | async\">\n        <pry-multi-class-condition [id]=\"condition.id\"></pry-multi-class-condition>\n      </ng-container>\n    </div>\n    <div class=\"o-search-multi-class__add-condition\">\n      <button (click)=\"onAddCondition()\" class=\"a-btn a-btn--secondary -size-sm\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"add\"></pry-icon>\n        {{ '@pry.search.multi.addCondition' | i18n }}\n      </button>\n    </div>\n  </div>\n</div>\n\n<ng-template #infoTooltip>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchMulticlass\">\n    <span class=\"m-tooltip__text\"> Options suppl\u00E9mentaires </span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryToggleComponent, selector: "pry-toggle", inputs: ["alwaysActive", "disabled", "mode", "size", "dir", "leftword", "rightword"] }, { kind: "directive", type: i3.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "directive", type: i3.PryOverlayDirective, selector: "[pryOverlay]", inputs: ["pryOverlay", "styleReversed", "pryOverlaySticky", "pryOverlayNoPadding", "pryOverlayPosition", "overlayOpen", "hasBackdrop"], outputs: ["overlayOpenChange"] }, { kind: "component", type: MultiClassConditionComponent, selector: "pry-multi-class-condition", inputs: ["id"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchMultiClassComponent, selector: "pry-search-multi-class", ngImport: i0, template: "<div class=\"o-search-multi-class\">\n  <div class=\"o-search-multi-class__header\">\n    <h3 class=\"a-h3\">{{ '@pry.search.multi.title' | i18n }}</h3>\n    <div\n      class=\"a-tooltip\"\n      [attr.data-tooltip]=\"'@pry.search.multi.extraOptions' | i18n\"\n      data-tooltip-position=\"bottom\"\n      [pryOverlay]=\"optionOverlay\"\n      [(overlayOpen)]=\"optionsOpen\"\n      (click)=\"optionsOpen = !optionsOpen\"\n    >\n      <button class=\"a-btn a-btn--icon-text\">\n        {{ '@pry.search.multi.options' | i18n }}\n        <pry-icon iconSvg=\"tune\" [width]=\"16\" [height]=\"16\" [animation]=\"false\"></pry-icon>\n      </button>\n    </div>\n    <ng-template #optionOverlay>\n      <div class=\"o-search-multi-class__options\">\n        <pry-toggle\n          [ngModel]=\"(multiType$ | async) === 'OR'\"\n          [leftword]=\"'@pry.search.type.or' | i18n\"\n          [rightword]=\"'@pry.search.type.and' | i18n\"\n          [alwaysActive]=\"true\"\n          (ngModelChange)=\"onChangeMultiType($event)\"\n          >{{ '@pry.search.multi.multiType' | i18n }}</pry-toggle\n        >\n      </div>\n    </ng-template>\n  </div>\n\n  <div class=\"o-search-multi-class__conditions-wrapper\">\n    <div class=\"o-search-multi-class__conditions\">\n      <ng-container *ngFor=\"let condition of conditions$ | async\">\n        <pry-multi-class-condition [id]=\"condition.id\"></pry-multi-class-condition>\n      </ng-container>\n    </div>\n    <div class=\"o-search-multi-class__add-condition\">\n      <button (click)=\"onAddCondition()\" class=\"a-btn a-btn--secondary -size-sm\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"add\"></pry-icon>\n        {{ '@pry.search.multi.addCondition' | i18n }}\n      </button>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryToggleComponent, selector: "pry-toggle", inputs: ["alwaysActive", "disabled", "mode", "size", "dir", "leftword", "rightword"] }, { kind: "directive", type: i3.PryOverlayDirective, selector: "[pryOverlay]", inputs: ["pryOverlay", "styleReversed", "pryOverlaySticky", "pryOverlayNoPadding", "pryOverlayPosition", "overlayOpen", "hasBackdrop"], outputs: ["overlayOpenChange"] }, { kind: "component", type: MultiClassConditionComponent, selector: "pry-multi-class-condition", inputs: ["id"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchMultiClassComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-search-multi-class', template: "<div class=\"o-search-multi-class\">\n  <div class=\"o-search-multi-class__header\">\n    <h3 class=\"a-h3\">{{ '@pry.search.multi.title' | i18n }}</h3>\n    <div class=\"\" [pryOverlay]=\"optionOverlay\" [(overlayOpen)]=\"optionsOpen\" (click)=\"optionsOpen = !optionsOpen\">\n      <button\n        class=\"a-btn a-btn--icon-text\"\n        [pryTooltip]=\"infoTooltip\"\n        pryTooltipPosition=\"bottom\"\n        aria-describedby=\"infoTooltip_searchMulticlass\"\n      >\n        {{ '@pry.search.multi.options' | i18n }}\n        <pry-icon iconSvg=\"tune\" [width]=\"16\" [height]=\"16\" [animation]=\"false\"></pry-icon>\n      </button>\n    </div>\n    <ng-template #optionOverlay>\n      <div class=\"o-search-multi-class__options\">\n        <pry-toggle\n          [ngModel]=\"(multiType$ | async) === 'OR'\"\n          [leftword]=\"'@pry.search.type.or' | i18n\"\n          [rightword]=\"'@pry.search.type.and' | i18n\"\n          [alwaysActive]=\"true\"\n          (ngModelChange)=\"onChangeMultiType($event)\"\n          >{{ '@pry.search.multi.multiType' | i18n }}</pry-toggle\n        >\n      </div>\n    </ng-template>\n  </div>\n\n  <div class=\"o-search-multi-class__conditions-wrapper\">\n    <div class=\"o-search-multi-class__conditions\">\n      <ng-container *ngFor=\"let condition of conditions$ | async\">\n        <pry-multi-class-condition [id]=\"condition.id\"></pry-multi-class-condition>\n      </ng-container>\n    </div>\n    <div class=\"o-search-multi-class__add-condition\">\n      <button (click)=\"onAddCondition()\" class=\"a-btn a-btn--secondary -size-sm\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"add\"></pry-icon>\n        {{ '@pry.search.multi.addCondition' | i18n }}\n      </button>\n    </div>\n  </div>\n</div>\n\n<ng-template #infoTooltip>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchMulticlass\">\n    <span class=\"m-tooltip__text\"> Options suppl\u00E9mentaires </span>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pry-search-multi-class', template: "<div class=\"o-search-multi-class\">\n  <div class=\"o-search-multi-class__header\">\n    <h3 class=\"a-h3\">{{ '@pry.search.multi.title' | i18n }}</h3>\n    <div\n      class=\"a-tooltip\"\n      [attr.data-tooltip]=\"'@pry.search.multi.extraOptions' | i18n\"\n      data-tooltip-position=\"bottom\"\n      [pryOverlay]=\"optionOverlay\"\n      [(overlayOpen)]=\"optionsOpen\"\n      (click)=\"optionsOpen = !optionsOpen\"\n    >\n      <button class=\"a-btn a-btn--icon-text\">\n        {{ '@pry.search.multi.options' | i18n }}\n        <pry-icon iconSvg=\"tune\" [width]=\"16\" [height]=\"16\" [animation]=\"false\"></pry-icon>\n      </button>\n    </div>\n    <ng-template #optionOverlay>\n      <div class=\"o-search-multi-class__options\">\n        <pry-toggle\n          [ngModel]=\"(multiType$ | async) === 'OR'\"\n          [leftword]=\"'@pry.search.type.or' | i18n\"\n          [rightword]=\"'@pry.search.type.and' | i18n\"\n          [alwaysActive]=\"true\"\n          (ngModelChange)=\"onChangeMultiType($event)\"\n          >{{ '@pry.search.multi.multiType' | i18n }}</pry-toggle\n        >\n      </div>\n    </ng-template>\n  </div>\n\n  <div class=\"o-search-multi-class__conditions-wrapper\">\n    <div class=\"o-search-multi-class__conditions\">\n      <ng-container *ngFor=\"let condition of conditions$ | async\">\n        <pry-multi-class-condition [id]=\"condition.id\"></pry-multi-class-condition>\n      </ng-container>\n    </div>\n    <div class=\"o-search-multi-class__add-condition\">\n      <button (click)=\"onAddCondition()\" class=\"a-btn a-btn--secondary -size-sm\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"add\"></pry-icon>\n        {{ '@pry.search.multi.addCondition' | i18n }}\n      </button>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }]; } });
 
 class PrySearchFulltextComponent {
@@ -1468,11 +1471,11 @@ class PrySearchFulltextComponent {
         this.searchChange.emit(payload);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchFulltextComponent, deps: [{ token: i1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchFulltextComponent, selector: "pry-search-fulltext", inputs: { mode: "mode", launchButton: "launchButton", currentEdit: "currentEdit" }, outputs: { searchChange: "searchChange" }, host: { listeners: { "document:click": "clickout($event)", "window:keyup.enter": "keyEvent($event)" } }, viewQueries: [{ propertyName: "searchButton", first: true, predicate: ["searchButton"], descendants: true, read: ElementRef }, { propertyName: "searchTrigger", first: true, predicate: ["searchTrigger"], descendants: true, read: ElementRef }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef }, { propertyName: "searchOverlayRef", first: true, predicate: ["searchOverlay"], descendants: true, read: ElementRef }, { propertyName: "searchClass", first: true, predicate: ["searchClass"], descendants: true }, { propertyName: "chooseClasses", first: true, predicate: ["chooseClasses"], descendants: true }], ngImport: i0, template: "<pry-search-css></pry-search-css>\n<div class=\"o-search-fulltext\" [class.o-search-fulltext--vertical]=\"mode === 'vertical'\">\n  <div class=\"o-search-fulltext__container\">\n    <button\n      #searchClass\n      type=\"button\"\n      class=\"o-search-fulltext__classes\"\n      [class.o-search-fulltext__classes--inline]=\"mode === 'inline'\"\n      [pryOverlay]=\"classesOverlay\"\n      [(overlayOpen)]=\"panelClassesOpen\"\n      pryOverlayPosition=\"start-top\"\n      [pryOverlaySticky]=\"true\"\n      [pryOverlayNoPadding]=\"true\"\n      (click)=\"panelClassesOpen = true\"\n    >\n      <span\n        class=\"o-search-fulltext__classes__content\"\n        [pryTooltip]=\"infoTooltip\"\n        pryTooltipPosition=\"bottom\"\n        aria-describedby=\"infoTooltip_searchfulltext\"\n      >\n        <pry-icon\n          [iconSvg]=\"classesSelected.length === 0 ? 'apps' : 'detail'\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [animation]=\"false\"\n        ></pry-icon>\n        <span class=\"o-search-fulltext__classes__content__label\" *ngIf=\"mode === 'inline'\">\n          {{ classesSelectedLabel | i18n: { nb: classesSelected.length } }}\n        </span>\n      </span>\n\n      <span class=\"o-search-fulltext__classes__arrow\">\n        <pry-icon\n          iconSvg=\"fleche_bas\"\n          [width]=\"17\"\n          [height]=\"17\"\n          [animation]=\"false\"\n          class=\"o-search-fulltext__classes__arrow__icon\"\n          [class.is-open]=\"panelClassesOpen\"\n        ></pry-icon>\n      </span>\n    </button>\n\n    <pry-choose-widget\n      [mode]=\"'input'\"\n      [class.m-choose-widget__input__inline]=\"mode === 'inline'\"\n      [panelOpen]=\"panelSearchOpen\"\n      [width]=\"searchPanelWidth ?? 200\"\n      (selected)=\"onSelectWidget($event)\"\n    >\n      <input\n        #searchInput\n        [(ngModel)]=\"search\"\n        (input)=\"onChangeSearch($event)\"\n        (focusin)=\"onOpenSearchPanel()\"\n        (focusout)=\"onFocusOut()\"\n      />\n      <div\n        *ngIf=\"!searchDisabled\"\n        class=\"o-search-fulltext__input__clear\"\n        [pryTooltip]=\"infoTooltipClose\"\n        pryTooltipPosition=\"bottom\"\n        aria-describedby=\"infoTooltipClose_searchfulltext\"\n      >\n        <div class=\"o-search-fulltext__input__clear__wrapper\" (click)=\"onClearSearch($event)\">\n          <pry-icon iconSvg=\"close\" [height]=\"16\" [width]=\"16\" [animation]=\"false\"></pry-icon>\n          <span class=\"u-visually-hidden\">Effacer la saisie</span>\n        </div>\n      </div>\n    </pry-choose-widget>\n  </div>\n\n  <button\n    #searchButton\n    class=\"a-btn a-btn--primary\"\n    (click)=\"onSearch()\"\n    [class.o-search-fulltext__button__inline]=\"mode === 'inline'\"\n    [ngClass]=\"{ ' -width-full': mode === 'vertical' }\"\n    [disabled]=\"searchDisabled\"\n    *ngIf=\"launchButton\"\n    [pryTooltip]=\"infoTooltipSearch\"\n    pryTooltipPosition=\"bottom\"\n    aria-describedby=\"infoTooltipSearch_searchfulltext\"\n  >\n    <pry-icon iconSvg=\"search-line\" [animation]=\"false\"></pry-icon>\n    <span *ngIf=\"mode === 'vertical'\">{{ '@pry.search.fulltext.search' | i18n }}</span>\n    <span class=\"u-visually-hidden\">Lancer la recherche</span>\n  </button>\n</div>\n\n<ng-template #classesOverlay>\n  <div\n    class=\"o-search-fulltext__classes-overlay\"\n    #chooseClasses\n    (keydown.escape)=\"closeFocus()\"\n    (keydown.arrowDown)=\"onArrowDown()\"\n    (keydown.arrowUp)=\"onArrowUp()\"\n  >\n    <button class=\"o-search-fulltext__classes-overlay__item\" (click)=\"onSelectAllClasses()\">\n      <pry-icon iconSvg=\"apps\" [width]=\"20\" [height]=\"20\"></pry-icon>\n      <span class=\"o-search-fulltext__classes-overlay__item__label\">{{\n        '@pry.search.fulltext.allClasses' | i18n\n      }}</span>\n    </button>\n    <ng-container *ngFor=\"let clazz of classes$ | async; let last = last\">\n      <button\n        type=\"button\"\n        class=\"o-search-fulltext__classes-overlay__item\"\n        (click)=\"onSelectClass(clazz)\"\n        [class.o-search-fulltext__classes-overlay__item__selected]=\"classesSelected.includes(clazz.id)\"\n        (keydown.tab)=\"last ? closeFocus() : null\"\n      >\n        <img\n          alt=\"class\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [src]=\"clazz.id | translateId: { type: 'class', output: 'icon' } | async\"\n        />\n        <span class=\"o-search-fulltext__classes-overlay__item__label\">{{ clazz.name }}</span>\n      </button>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltip>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchfulltext\">\n    <span class=\"m-tooltip__text\"> S\u00E9lectionner la classe </span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipSearch>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipSearch_searchfulltext\">\n    <span class=\"m-tooltip__text\"> Lancer la recherche </span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipClose>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipClose_searchfulltext\">\n    <span class=\"m-tooltip__text\"> Effacer la saisie </span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "directive", type: i3.PryOverlayDirective, selector: "[pryOverlay]", inputs: ["pryOverlay", "styleReversed", "pryOverlaySticky", "pryOverlayNoPadding", "pryOverlayPosition", "overlayOpen", "hasBackdrop"], outputs: ["overlayOpenChange"] }, { kind: "component", type: ChooseWidgetComponent, selector: "pry-choose-widget", inputs: ["panelOpen", "mode", "width"], outputs: ["selected"] }, { kind: "component", type: PrySearchCssComponent, selector: "pry-search-css" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchFulltextComponent, selector: "pry-search-fulltext", inputs: { mode: "mode", launchButton: "launchButton", currentEdit: "currentEdit" }, outputs: { searchChange: "searchChange" }, host: { listeners: { "document:click": "clickout($event)", "window:keyup.enter": "keyEvent($event)" } }, viewQueries: [{ propertyName: "searchButton", first: true, predicate: ["searchButton"], descendants: true, read: ElementRef }, { propertyName: "searchTrigger", first: true, predicate: ["searchTrigger"], descendants: true, read: ElementRef }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef }, { propertyName: "searchOverlayRef", first: true, predicate: ["searchOverlay"], descendants: true, read: ElementRef }, { propertyName: "searchClass", first: true, predicate: ["searchClass"], descendants: true }, { propertyName: "chooseClasses", first: true, predicate: ["chooseClasses"], descendants: true }], ngImport: i0, template: "<pry-search-css></pry-search-css>\n<div class=\"o-search-fulltext\" [class.o-search-fulltext--vertical]=\"mode === 'vertical'\">\n  <div class=\"o-search-fulltext__container\">\n    <button\n      #searchClass\n      type=\"button\"\n      class=\"o-search-fulltext__classes\"\n      [class.o-search-fulltext__classes--inline]=\"mode === 'inline'\"\n      [pryOverlay]=\"classesOverlay\"\n      [(overlayOpen)]=\"panelClassesOpen\"\n      pryOverlayPosition=\"start-top\"\n      [pryOverlaySticky]=\"true\"\n      [pryOverlayNoPadding]=\"true\"\n      (click)=\"panelClassesOpen = true\"\n    >\n      <span\n        class=\"o-search-fulltext__classes__content a-tooltip\"\n        [attr.data-tooltip]=\"'@pry.search.fulltext.selectClass' | i18n\"\n        data-tooltip-position=\"bottom\"\n      >\n        <pry-icon\n          [iconSvg]=\"classesSelected.length === 0 ? 'apps' : 'detail'\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [animation]=\"false\"\n        ></pry-icon>\n        <span class=\"o-search-fulltext__classes__content__label\" *ngIf=\"mode === 'inline'\">\n          {{ classesSelectedLabel | i18n : { nb: classesSelected.length } }}\n        </span>\n      </span>\n\n      <span class=\"o-search-fulltext__classes__arrow\">\n        <pry-icon\n          iconSvg=\"fleche_bas\"\n          [width]=\"17\"\n          [height]=\"17\"\n          [animation]=\"false\"\n          class=\"o-search-fulltext__classes__arrow__icon\"\n          [class.is-open]=\"panelClassesOpen\"\n        ></pry-icon>\n      </span>\n    </button>\n\n    <pry-choose-widget\n      [mode]=\"'input'\"\n      [class.m-choose-widget__input__inline]=\"mode === 'inline'\"\n      [panelOpen]=\"panelSearchOpen\"\n      [width]=\"searchPanelWidth ?? 200\"\n      (selected)=\"onSelectWidget($event)\"\n    >\n      <input\n        #searchInput\n        [(ngModel)]=\"search\"\n        (input)=\"onChangeSearch($event)\"\n        (focusin)=\"onOpenSearchPanel()\"\n        (focusout)=\"onFocusOut()\"\n      />\n      <div *ngIf=\"!searchDisabled\" class=\"o-search-fulltext__input__clear\">\n        <div class=\"o-search-fulltext__input__clear__wrapper\" (click)=\"onClearSearch($event)\">\n          <div\n            class=\"a-tooltip\"\n            [attr.data-tooltip]=\"'@pry.search.fulltext.clear' | i18n\"\n            data-tooltip-position=\"bottom\"\n          >\n            <pry-icon iconSvg=\"close\" [height]=\"16\" [width]=\"16\" [animation]=\"false\"></pry-icon>\n            <span class=\"u-visually-hidden\">{{ '@pry.search.fulltext.clear' | i18n }}</span>\n          </div>\n        </div>\n      </div>\n    </pry-choose-widget>\n  </div>\n\n  <button\n    #searchButton\n    class=\"a-btn a-btn--primary a-tooltip\"\n    (click)=\"onSearch()\"\n    [class.o-search-fulltext__button__inline]=\"mode === 'inline'\"\n    [ngClass]=\"{ ' -width-full': mode === 'vertical' }\"\n    [disabled]=\"searchDisabled\"\n    *ngIf=\"launchButton\"\n    [attr.data-tooltip]=\"'@pry.search.fulltext.search' | i18n\"\n    data-tooltip-position=\"bottom\"\n  >\n    <pry-icon iconSvg=\"search-line\" [animation]=\"false\"></pry-icon>\n    <span *ngIf=\"mode === 'vertical'\">{{ '@pry.search.fulltext.search' | i18n }}</span>\n    <span class=\"u-visually-hidden\">{{ '@pry.search.fulltext.search' | i18n }}</span>\n  </button>\n</div>\n\n<ng-template #classesOverlay>\n  <div\n    class=\"o-search-fulltext__classes-overlay\"\n    #chooseClasses\n    (keydown.escape)=\"closeFocus()\"\n    (keydown.arrowDown)=\"onArrowDown()\"\n    (keydown.arrowUp)=\"onArrowUp()\"\n  >\n    <button class=\"o-search-fulltext__classes-overlay__item\" (click)=\"onSelectAllClasses()\">\n      <pry-icon iconSvg=\"apps\" [width]=\"20\" [height]=\"20\"></pry-icon>\n      <span class=\"o-search-fulltext__classes-overlay__item__label\">{{\n        '@pry.search.fulltext.allClasses' | i18n\n      }}</span>\n    </button>\n    <ng-container *ngFor=\"let clazz of classes$ | async; let last = last\">\n      <button\n        type=\"button\"\n        class=\"o-search-fulltext__classes-overlay__item\"\n        (click)=\"onSelectClass(clazz)\"\n        [class.o-search-fulltext__classes-overlay__item__selected]=\"classesSelected.includes(clazz.id)\"\n        (keydown.tab)=\"last ? closeFocus() : null\"\n      >\n        <img\n          alt=\"class\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [src]=\"clazz.id | translateId : { type: 'class', output: 'icon' } | async\"\n        />\n        <span class=\"o-search-fulltext__classes-overlay__item__label\">{{ clazz.name }}</span>\n      </button>\n    </ng-container>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.PryOverlayDirective, selector: "[pryOverlay]", inputs: ["pryOverlay", "styleReversed", "pryOverlaySticky", "pryOverlayNoPadding", "pryOverlayPosition", "overlayOpen", "hasBackdrop"], outputs: ["overlayOpenChange"] }, { kind: "component", type: ChooseWidgetComponent, selector: "pry-choose-widget", inputs: ["panelOpen", "mode", "width"], outputs: ["selected"] }, { kind: "component", type: PrySearchCssComponent, selector: "pry-search-css" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchFulltextComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-search-fulltext', template: "<pry-search-css></pry-search-css>\n<div class=\"o-search-fulltext\" [class.o-search-fulltext--vertical]=\"mode === 'vertical'\">\n  <div class=\"o-search-fulltext__container\">\n    <button\n      #searchClass\n      type=\"button\"\n      class=\"o-search-fulltext__classes\"\n      [class.o-search-fulltext__classes--inline]=\"mode === 'inline'\"\n      [pryOverlay]=\"classesOverlay\"\n      [(overlayOpen)]=\"panelClassesOpen\"\n      pryOverlayPosition=\"start-top\"\n      [pryOverlaySticky]=\"true\"\n      [pryOverlayNoPadding]=\"true\"\n      (click)=\"panelClassesOpen = true\"\n    >\n      <span\n        class=\"o-search-fulltext__classes__content\"\n        [pryTooltip]=\"infoTooltip\"\n        pryTooltipPosition=\"bottom\"\n        aria-describedby=\"infoTooltip_searchfulltext\"\n      >\n        <pry-icon\n          [iconSvg]=\"classesSelected.length === 0 ? 'apps' : 'detail'\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [animation]=\"false\"\n        ></pry-icon>\n        <span class=\"o-search-fulltext__classes__content__label\" *ngIf=\"mode === 'inline'\">\n          {{ classesSelectedLabel | i18n: { nb: classesSelected.length } }}\n        </span>\n      </span>\n\n      <span class=\"o-search-fulltext__classes__arrow\">\n        <pry-icon\n          iconSvg=\"fleche_bas\"\n          [width]=\"17\"\n          [height]=\"17\"\n          [animation]=\"false\"\n          class=\"o-search-fulltext__classes__arrow__icon\"\n          [class.is-open]=\"panelClassesOpen\"\n        ></pry-icon>\n      </span>\n    </button>\n\n    <pry-choose-widget\n      [mode]=\"'input'\"\n      [class.m-choose-widget__input__inline]=\"mode === 'inline'\"\n      [panelOpen]=\"panelSearchOpen\"\n      [width]=\"searchPanelWidth ?? 200\"\n      (selected)=\"onSelectWidget($event)\"\n    >\n      <input\n        #searchInput\n        [(ngModel)]=\"search\"\n        (input)=\"onChangeSearch($event)\"\n        (focusin)=\"onOpenSearchPanel()\"\n        (focusout)=\"onFocusOut()\"\n      />\n      <div\n        *ngIf=\"!searchDisabled\"\n        class=\"o-search-fulltext__input__clear\"\n        [pryTooltip]=\"infoTooltipClose\"\n        pryTooltipPosition=\"bottom\"\n        aria-describedby=\"infoTooltipClose_searchfulltext\"\n      >\n        <div class=\"o-search-fulltext__input__clear__wrapper\" (click)=\"onClearSearch($event)\">\n          <pry-icon iconSvg=\"close\" [height]=\"16\" [width]=\"16\" [animation]=\"false\"></pry-icon>\n          <span class=\"u-visually-hidden\">Effacer la saisie</span>\n        </div>\n      </div>\n    </pry-choose-widget>\n  </div>\n\n  <button\n    #searchButton\n    class=\"a-btn a-btn--primary\"\n    (click)=\"onSearch()\"\n    [class.o-search-fulltext__button__inline]=\"mode === 'inline'\"\n    [ngClass]=\"{ ' -width-full': mode === 'vertical' }\"\n    [disabled]=\"searchDisabled\"\n    *ngIf=\"launchButton\"\n    [pryTooltip]=\"infoTooltipSearch\"\n    pryTooltipPosition=\"bottom\"\n    aria-describedby=\"infoTooltipSearch_searchfulltext\"\n  >\n    <pry-icon iconSvg=\"search-line\" [animation]=\"false\"></pry-icon>\n    <span *ngIf=\"mode === 'vertical'\">{{ '@pry.search.fulltext.search' | i18n }}</span>\n    <span class=\"u-visually-hidden\">Lancer la recherche</span>\n  </button>\n</div>\n\n<ng-template #classesOverlay>\n  <div\n    class=\"o-search-fulltext__classes-overlay\"\n    #chooseClasses\n    (keydown.escape)=\"closeFocus()\"\n    (keydown.arrowDown)=\"onArrowDown()\"\n    (keydown.arrowUp)=\"onArrowUp()\"\n  >\n    <button class=\"o-search-fulltext__classes-overlay__item\" (click)=\"onSelectAllClasses()\">\n      <pry-icon iconSvg=\"apps\" [width]=\"20\" [height]=\"20\"></pry-icon>\n      <span class=\"o-search-fulltext__classes-overlay__item__label\">{{\n        '@pry.search.fulltext.allClasses' | i18n\n      }}</span>\n    </button>\n    <ng-container *ngFor=\"let clazz of classes$ | async; let last = last\">\n      <button\n        type=\"button\"\n        class=\"o-search-fulltext__classes-overlay__item\"\n        (click)=\"onSelectClass(clazz)\"\n        [class.o-search-fulltext__classes-overlay__item__selected]=\"classesSelected.includes(clazz.id)\"\n        (keydown.tab)=\"last ? closeFocus() : null\"\n      >\n        <img\n          alt=\"class\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [src]=\"clazz.id | translateId: { type: 'class', output: 'icon' } | async\"\n        />\n        <span class=\"o-search-fulltext__classes-overlay__item__label\">{{ clazz.name }}</span>\n      </button>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltip>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltip_searchfulltext\">\n    <span class=\"m-tooltip__text\"> S\u00E9lectionner la classe </span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipSearch>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipSearch_searchfulltext\">\n    <span class=\"m-tooltip__text\"> Lancer la recherche </span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipClose>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipClose_searchfulltext\">\n    <span class=\"m-tooltip__text\"> Effacer la saisie </span>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pry-search-fulltext', template: "<pry-search-css></pry-search-css>\n<div class=\"o-search-fulltext\" [class.o-search-fulltext--vertical]=\"mode === 'vertical'\">\n  <div class=\"o-search-fulltext__container\">\n    <button\n      #searchClass\n      type=\"button\"\n      class=\"o-search-fulltext__classes\"\n      [class.o-search-fulltext__classes--inline]=\"mode === 'inline'\"\n      [pryOverlay]=\"classesOverlay\"\n      [(overlayOpen)]=\"panelClassesOpen\"\n      pryOverlayPosition=\"start-top\"\n      [pryOverlaySticky]=\"true\"\n      [pryOverlayNoPadding]=\"true\"\n      (click)=\"panelClassesOpen = true\"\n    >\n      <span\n        class=\"o-search-fulltext__classes__content a-tooltip\"\n        [attr.data-tooltip]=\"'@pry.search.fulltext.selectClass' | i18n\"\n        data-tooltip-position=\"bottom\"\n      >\n        <pry-icon\n          [iconSvg]=\"classesSelected.length === 0 ? 'apps' : 'detail'\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [animation]=\"false\"\n        ></pry-icon>\n        <span class=\"o-search-fulltext__classes__content__label\" *ngIf=\"mode === 'inline'\">\n          {{ classesSelectedLabel | i18n : { nb: classesSelected.length } }}\n        </span>\n      </span>\n\n      <span class=\"o-search-fulltext__classes__arrow\">\n        <pry-icon\n          iconSvg=\"fleche_bas\"\n          [width]=\"17\"\n          [height]=\"17\"\n          [animation]=\"false\"\n          class=\"o-search-fulltext__classes__arrow__icon\"\n          [class.is-open]=\"panelClassesOpen\"\n        ></pry-icon>\n      </span>\n    </button>\n\n    <pry-choose-widget\n      [mode]=\"'input'\"\n      [class.m-choose-widget__input__inline]=\"mode === 'inline'\"\n      [panelOpen]=\"panelSearchOpen\"\n      [width]=\"searchPanelWidth ?? 200\"\n      (selected)=\"onSelectWidget($event)\"\n    >\n      <input\n        #searchInput\n        [(ngModel)]=\"search\"\n        (input)=\"onChangeSearch($event)\"\n        (focusin)=\"onOpenSearchPanel()\"\n        (focusout)=\"onFocusOut()\"\n      />\n      <div *ngIf=\"!searchDisabled\" class=\"o-search-fulltext__input__clear\">\n        <div class=\"o-search-fulltext__input__clear__wrapper\" (click)=\"onClearSearch($event)\">\n          <div\n            class=\"a-tooltip\"\n            [attr.data-tooltip]=\"'@pry.search.fulltext.clear' | i18n\"\n            data-tooltip-position=\"bottom\"\n          >\n            <pry-icon iconSvg=\"close\" [height]=\"16\" [width]=\"16\" [animation]=\"false\"></pry-icon>\n            <span class=\"u-visually-hidden\">{{ '@pry.search.fulltext.clear' | i18n }}</span>\n          </div>\n        </div>\n      </div>\n    </pry-choose-widget>\n  </div>\n\n  <button\n    #searchButton\n    class=\"a-btn a-btn--primary a-tooltip\"\n    (click)=\"onSearch()\"\n    [class.o-search-fulltext__button__inline]=\"mode === 'inline'\"\n    [ngClass]=\"{ ' -width-full': mode === 'vertical' }\"\n    [disabled]=\"searchDisabled\"\n    *ngIf=\"launchButton\"\n    [attr.data-tooltip]=\"'@pry.search.fulltext.search' | i18n\"\n    data-tooltip-position=\"bottom\"\n  >\n    <pry-icon iconSvg=\"search-line\" [animation]=\"false\"></pry-icon>\n    <span *ngIf=\"mode === 'vertical'\">{{ '@pry.search.fulltext.search' | i18n }}</span>\n    <span class=\"u-visually-hidden\">{{ '@pry.search.fulltext.search' | i18n }}</span>\n  </button>\n</div>\n\n<ng-template #classesOverlay>\n  <div\n    class=\"o-search-fulltext__classes-overlay\"\n    #chooseClasses\n    (keydown.escape)=\"closeFocus()\"\n    (keydown.arrowDown)=\"onArrowDown()\"\n    (keydown.arrowUp)=\"onArrowUp()\"\n  >\n    <button class=\"o-search-fulltext__classes-overlay__item\" (click)=\"onSelectAllClasses()\">\n      <pry-icon iconSvg=\"apps\" [width]=\"20\" [height]=\"20\"></pry-icon>\n      <span class=\"o-search-fulltext__classes-overlay__item__label\">{{\n        '@pry.search.fulltext.allClasses' | i18n\n      }}</span>\n    </button>\n    <ng-container *ngFor=\"let clazz of classes$ | async; let last = last\">\n      <button\n        type=\"button\"\n        class=\"o-search-fulltext__classes-overlay__item\"\n        (click)=\"onSelectClass(clazz)\"\n        [class.o-search-fulltext__classes-overlay__item__selected]=\"classesSelected.includes(clazz.id)\"\n        (keydown.tab)=\"last ? closeFocus() : null\"\n      >\n        <img\n          alt=\"class\"\n          [height]=\"20\"\n          [width]=\"20\"\n          [src]=\"clazz.id | translateId : { type: 'class', output: 'icon' } | async\"\n        />\n        <span class=\"o-search-fulltext__classes-overlay__item__label\">{{ clazz.name }}</span>\n      </button>\n    </ng-container>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }]; }, propDecorators: { searchButton: [{
                 type: ViewChild,
                 args: ['searchButton', { read: ElementRef }]
@@ -1781,11 +1784,11 @@ class PrySearchToolsComponent {
         this.store.dispatch(DataSourceActions.namedQuery.updateCurrentEdit({ currentEdit: { visibility: $event } }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchToolsComponent, deps: [{ token: i1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchToolsComponent, selector: "pry-search-tools", host: { properties: { "class.o-pry-search-tools-wrapper": "this.class", "class.is-close": "this.searchToolsClose" } }, ngImport: i0, template: "<div\n  class=\"o-pry-search-tools\"\n  [class.is-close]=\"searchToolsClose\"\n  [class.is-mono]=\"isNewMono || (isEditMono$ | async)\"\n>\n  <button\n    type=\"button\"\n    class=\"a-btn a-btn--icon-text -back\"\n    (click)=\"onSearchTools()\"\n    aria-pressed=\"false\"\n    *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n    [pryTooltip]=\"infoTooltipBack\"\n    pryTooltipPosition=\"bottom\"\n    aria-describedby=\"infoTooltipBack_searchTools\"\n  >\n    <pry-icon iconSvg=\"arrow_back\" [width]=\"24\" [height]=\"24\" [animation]=\"false\"></pry-icon>\n    <span>{{ '@pry.search.button.backSearch' | i18n }}</span>\n  </button>\n  <div class=\"o-pry-search-tools__content\" [class.is-close]=\"searchToolsClose\">\n    <button\n      *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n      class=\"a-btn a-btn--icon-text -link-like u-self-end\"\n      (click)=\"reset()\"\n      id=\"btn_reset\"\n    >\n      <pry-icon iconSvg=\"reset\" [width]=\"18\" [height]=\"18\"></pry-icon>\n      {{ '@pry.search.button.reset' | i18n }}\n    </button>\n    <ng-container *ngIf=\"editInProgress$ | async\">\n      <pry-share [ngModel]=\"(currentEdit$ | async)?.visibility\" (ngModelChange)=\"updateVisibility($event)\"></pry-share>\n    </ng-container>\n    <ng-container *ngIf=\"(editInProgress$ | async) && !(isRename$ | async) && !(loading$ | async); else noEdit\">\n      <pry-edit-named-query\n        (searchFulltextChange)=\"onSearchFulltextChange($event)\"\n        (cancelled)=\"onSearchTools()\"\n      ></pry-edit-named-query>\n    </ng-container>\n    <ng-template #noEdit>\n      <ng-container *ngIf=\"isSearchCriteria && !(loading$ | async); else noSearch\">\n        <pry-toggle\n          class=\"o-pry-search-tools__content__toggle\"\n          [ngModel]=\"isSearchMono\"\n          (ngModelChange)=\"onMonoSearch()\"\n          [alwaysActive]=\"true\"\n          mode=\"action\"\n        >\n          {{ (isSearchMono ? '@pry.search.button.mono' : '@pry.search.button.multi') | i18n }}\n        </pry-toggle>\n        <div class=\"o-pry-search-tools__content__full\">\n          <ng-container *ngIf=\"isSearchMono; else isMultiSearch\">\n            <pry-search-mono-class></pry-search-mono-class>\n          </ng-container>\n          <ng-template #isMultiSearch>\n            <pry-search-multi-class></pry-search-multi-class>\n          </ng-template>\n        </div>\n\n        <div class=\"o-pry-search-tools__content__button-search\">\n          <ng-container *ngIf=\"isSearchCriteria\">\n            <pry-choose-widget (selected)=\"selectWidget($event)\"></pry-choose-widget>\n          </ng-container>\n          <button class=\"a-btn a-btn--primary\" (click)=\"onSearchTools()\" *ngIf=\"!isSearchCriteria\">\n            {{ '@pry.search.button.cancel' | i18n }}\n          </button>\n          <button\n            [disabled]=\"\n              (!(searchMultiClassValid$ | async) && !isSearchMono) || (!(searchMonoClassValid$ | async) && isSearchMono)\n            \"\n            class=\"a-btn a-btn--primary\"\n            (click)=\"onSearch()\"\n          >\n            <pry-icon iconSvg=\"search-line\"></pry-icon>\n            {{ '@pry.search.button.search' | i18n }}\n          </button>\n        </div>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #noSearch>\n      <div class=\"o-pry-search-tools__content__full\">\n        <pry-search-home\n          class=\"o-pry-search-home\"\n          [isMoreList]=\"isMoreList\"\n          [searchFulltextTpl]=\"searchFulltextTpl\"\n          (changeListView)=\"onChangeListView($event)\"\n          (changeSearchCriteria)=\"onSearchCriteria()\"\n        ></pry-search-home>\n        <ng-template #searchFulltextTpl>\n          <pry-search-fulltext mode=\"vertical\" (searchChange)=\"onSearchFulltextChange($event)\"></pry-search-fulltext>\n        </ng-template>\n      </div>\n    </ng-template>\n  </div>\n  <div class=\"o-pry-search-tools__footer\" [class.is-close]=\"searchToolsClose\">\n    <pry-save-query-button\n      [editInProgress]=\"editInProgress$ | async\"\n      [currentEdit]=\"currentEdit$ | async\"\n      [currentEditType]=\"currentEditType$ | async\"\n      [fulltextValid]=\"isSearchFulltextValid\"\n      [multiValid]=\"searchMultiClassValid$ | async\"\n      [monoValid]=\"searchMonoClassValid$ | async\"\n      [isNotFulltext]=\"isSearchCriteria\"\n      [isMonoSearch]=\"isSearchMono\"\n      [fulltextSearch]=\"searchFulltextTemp\"\n    ></pry-save-query-button>\n  </div>\n</div>\n\n<ng-template #infoTooltipBack>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipBack_searchTools\">\n    <span class=\"m-tooltip__text\"> Retour \u00E0 la liste des recherches </span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryToggleComponent, selector: "pry-toggle", inputs: ["alwaysActive", "disabled", "mode", "size", "dir", "leftword", "rightword"] }, { kind: "directive", type: i3.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: i3.PryShareComponent, selector: "pry-share", inputs: ["value", "labelProperty", "valueProperty", "users$"] }, { kind: "component", type: PrySearchHomeComponent, selector: "pry-search-home", inputs: ["searchFulltextTpl", "isMoreList"], outputs: ["changeListView", "changeSearchCriteria"] }, { kind: "component", type: PrySearchMonoClassComponent, selector: "pry-search-mono-class" }, { kind: "component", type: PrySearchMultiClassComponent, selector: "pry-search-multi-class" }, { kind: "component", type: PrySearchFulltextComponent, selector: "pry-search-fulltext", inputs: ["mode", "launchButton", "currentEdit"], outputs: ["searchChange"] }, { kind: "component", type: PrySaveQueryButtonComponent, selector: "pry-save-query-button", inputs: ["editInProgress", "currentEdit", "currentEditType", "fulltextValid", "multiValid", "monoValid", "isNotFulltext", "isMonoSearch", "fulltextSearch", "saveDisabled"] }, { kind: "component", type: EditNamedQueryComponent, selector: "pry-edit-named-query", inputs: ["fromWidget"], outputs: ["searchFulltextChange", "cancelled", "searched"] }, { kind: "component", type: ChooseWidgetComponent, selector: "pry-choose-widget", inputs: ["panelOpen", "mode", "width"], outputs: ["selected"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySearchToolsComponent, selector: "pry-search-tools", host: { properties: { "class.o-pry-search-tools-wrapper": "this.class", "class.is-close": "this.searchToolsClose" } }, ngImport: i0, template: "<div\n  class=\"o-pry-search-tools\"\n  [class.is-close]=\"searchToolsClose\"\n  [class.is-mono]=\"isNewMono || (isEditMono$ | async)\"\n>\n  <button\n    type=\"button\"\n    class=\"a-btn a-btn--icon-text -back a-tooltip\"\n    (click)=\"onSearchTools()\"\n    aria-pressed=\"false\"\n    *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n    [attr.data-tooltip]=\"'@pry.search.button.backSearch' | i18n\"\n    data-tooltip-position=\"bottom\"\n  >\n    <pry-icon iconSvg=\"arrow_back\" [width]=\"24\" [height]=\"24\" [animation]=\"false\"></pry-icon>\n    <span>{{ '@pry.search.button.backSearch' | i18n }}</span>\n  </button>\n  <div class=\"o-pry-search-tools__content\" [class.is-close]=\"searchToolsClose\">\n    <button\n      *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n      class=\"a-btn a-btn--icon-text -link-like u-self-end\"\n      (click)=\"reset()\"\n      id=\"btn_reset\"\n    >\n      <pry-icon iconSvg=\"reset\" [width]=\"18\" [height]=\"18\"></pry-icon>\n      {{ '@pry.search.button.reset' | i18n }}\n    </button>\n    <ng-container *ngIf=\"editInProgress$ | async\">\n      <pry-share [ngModel]=\"(currentEdit$ | async)?.visibility\" (ngModelChange)=\"updateVisibility($event)\"></pry-share>\n    </ng-container>\n    <ng-container *ngIf=\"(editInProgress$ | async) && !(isRename$ | async) && !(loading$ | async); else noEdit\">\n      <pry-edit-named-query\n        (searchFulltextChange)=\"onSearchFulltextChange($event)\"\n        (cancelled)=\"onSearchTools()\"\n      ></pry-edit-named-query>\n    </ng-container>\n    <ng-template #noEdit>\n      <ng-container *ngIf=\"isSearchCriteria && !(loading$ | async); else noSearch\">\n        <pry-toggle\n          class=\"o-pry-search-tools__content__toggle\"\n          [ngModel]=\"isSearchMono\"\n          (ngModelChange)=\"onMonoSearch()\"\n          [alwaysActive]=\"true\"\n          mode=\"action\"\n        >\n          {{ (isSearchMono ? '@pry.search.button.mono' : '@pry.search.button.multi') | i18n }}\n        </pry-toggle>\n        <div class=\"o-pry-search-tools__content__full\">\n          <ng-container *ngIf=\"isSearchMono; else isMultiSearch\">\n            <pry-search-mono-class></pry-search-mono-class>\n          </ng-container>\n          <ng-template #isMultiSearch>\n            <pry-search-multi-class></pry-search-multi-class>\n          </ng-template>\n        </div>\n\n        <div class=\"o-pry-search-tools__content__button-search\">\n          <ng-container *ngIf=\"isSearchCriteria\">\n            <pry-choose-widget (selected)=\"selectWidget($event)\"></pry-choose-widget>\n          </ng-container>\n          <button class=\"a-btn a-btn--primary\" (click)=\"onSearchTools()\" *ngIf=\"!isSearchCriteria\">\n            {{ '@pry.search.button.cancel' | i18n }}\n          </button>\n          <button\n            [disabled]=\"\n              (!(searchMultiClassValid$ | async) && !isSearchMono) || (!(searchMonoClassValid$ | async) && isSearchMono)\n            \"\n            class=\"a-btn a-btn--primary\"\n            (click)=\"onSearch()\"\n          >\n            <pry-icon iconSvg=\"search-line\"></pry-icon>\n            {{ '@pry.search.button.search' | i18n }}\n          </button>\n        </div>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #noSearch>\n      <div class=\"o-pry-search-tools__content__full\">\n        <pry-search-home\n          class=\"o-pry-search-home\"\n          [isMoreList]=\"isMoreList\"\n          [searchFulltextTpl]=\"searchFulltextTpl\"\n          (changeListView)=\"onChangeListView($event)\"\n          (changeSearchCriteria)=\"onSearchCriteria()\"\n        ></pry-search-home>\n        <ng-template #searchFulltextTpl>\n          <pry-search-fulltext mode=\"vertical\" (searchChange)=\"onSearchFulltextChange($event)\"></pry-search-fulltext>\n        </ng-template>\n      </div>\n    </ng-template>\n  </div>\n  <div class=\"o-pry-search-tools__footer\" [class.is-close]=\"searchToolsClose\">\n    <pry-save-query-button\n      [editInProgress]=\"editInProgress$ | async\"\n      [currentEdit]=\"currentEdit$ | async\"\n      [currentEditType]=\"currentEditType$ | async\"\n      [fulltextValid]=\"isSearchFulltextValid\"\n      [multiValid]=\"searchMultiClassValid$ | async\"\n      [monoValid]=\"searchMonoClassValid$ | async\"\n      [isNotFulltext]=\"isSearchCriteria\"\n      [isMonoSearch]=\"isSearchMono\"\n      [fulltextSearch]=\"searchFulltextTemp\"\n    ></pry-save-query-button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryToggleComponent, selector: "pry-toggle", inputs: ["alwaysActive", "disabled", "mode", "size", "dir", "leftword", "rightword"] }, { kind: "component", type: i3.PryShareComponent, selector: "pry-share", inputs: ["value", "labelProperty", "valueProperty", "users$"] }, { kind: "component", type: PrySearchHomeComponent, selector: "pry-search-home", inputs: ["searchFulltextTpl", "isMoreList"], outputs: ["changeListView", "changeSearchCriteria"] }, { kind: "component", type: PrySearchMonoClassComponent, selector: "pry-search-mono-class" }, { kind: "component", type: PrySearchMultiClassComponent, selector: "pry-search-multi-class" }, { kind: "component", type: PrySearchFulltextComponent, selector: "pry-search-fulltext", inputs: ["mode", "launchButton", "currentEdit"], outputs: ["searchChange"] }, { kind: "component", type: PrySaveQueryButtonComponent, selector: "pry-save-query-button", inputs: ["editInProgress", "currentEdit", "currentEditType", "fulltextValid", "multiValid", "monoValid", "isNotFulltext", "isMonoSearch", "fulltextSearch", "saveDisabled"] }, { kind: "component", type: EditNamedQueryComponent, selector: "pry-edit-named-query", inputs: ["fromWidget"], outputs: ["searchFulltextChange", "cancelled", "searched"] }, { kind: "component", type: ChooseWidgetComponent, selector: "pry-choose-widget", inputs: ["panelOpen", "mode", "width"], outputs: ["selected"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySearchToolsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-search-tools', template: "<div\n  class=\"o-pry-search-tools\"\n  [class.is-close]=\"searchToolsClose\"\n  [class.is-mono]=\"isNewMono || (isEditMono$ | async)\"\n>\n  <button\n    type=\"button\"\n    class=\"a-btn a-btn--icon-text -back\"\n    (click)=\"onSearchTools()\"\n    aria-pressed=\"false\"\n    *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n    [pryTooltip]=\"infoTooltipBack\"\n    pryTooltipPosition=\"bottom\"\n    aria-describedby=\"infoTooltipBack_searchTools\"\n  >\n    <pry-icon iconSvg=\"arrow_back\" [width]=\"24\" [height]=\"24\" [animation]=\"false\"></pry-icon>\n    <span>{{ '@pry.search.button.backSearch' | i18n }}</span>\n  </button>\n  <div class=\"o-pry-search-tools__content\" [class.is-close]=\"searchToolsClose\">\n    <button\n      *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n      class=\"a-btn a-btn--icon-text -link-like u-self-end\"\n      (click)=\"reset()\"\n      id=\"btn_reset\"\n    >\n      <pry-icon iconSvg=\"reset\" [width]=\"18\" [height]=\"18\"></pry-icon>\n      {{ '@pry.search.button.reset' | i18n }}\n    </button>\n    <ng-container *ngIf=\"editInProgress$ | async\">\n      <pry-share [ngModel]=\"(currentEdit$ | async)?.visibility\" (ngModelChange)=\"updateVisibility($event)\"></pry-share>\n    </ng-container>\n    <ng-container *ngIf=\"(editInProgress$ | async) && !(isRename$ | async) && !(loading$ | async); else noEdit\">\n      <pry-edit-named-query\n        (searchFulltextChange)=\"onSearchFulltextChange($event)\"\n        (cancelled)=\"onSearchTools()\"\n      ></pry-edit-named-query>\n    </ng-container>\n    <ng-template #noEdit>\n      <ng-container *ngIf=\"isSearchCriteria && !(loading$ | async); else noSearch\">\n        <pry-toggle\n          class=\"o-pry-search-tools__content__toggle\"\n          [ngModel]=\"isSearchMono\"\n          (ngModelChange)=\"onMonoSearch()\"\n          [alwaysActive]=\"true\"\n          mode=\"action\"\n        >\n          {{ (isSearchMono ? '@pry.search.button.mono' : '@pry.search.button.multi') | i18n }}\n        </pry-toggle>\n        <div class=\"o-pry-search-tools__content__full\">\n          <ng-container *ngIf=\"isSearchMono; else isMultiSearch\">\n            <pry-search-mono-class></pry-search-mono-class>\n          </ng-container>\n          <ng-template #isMultiSearch>\n            <pry-search-multi-class></pry-search-multi-class>\n          </ng-template>\n        </div>\n\n        <div class=\"o-pry-search-tools__content__button-search\">\n          <ng-container *ngIf=\"isSearchCriteria\">\n            <pry-choose-widget (selected)=\"selectWidget($event)\"></pry-choose-widget>\n          </ng-container>\n          <button class=\"a-btn a-btn--primary\" (click)=\"onSearchTools()\" *ngIf=\"!isSearchCriteria\">\n            {{ '@pry.search.button.cancel' | i18n }}\n          </button>\n          <button\n            [disabled]=\"\n              (!(searchMultiClassValid$ | async) && !isSearchMono) || (!(searchMonoClassValid$ | async) && isSearchMono)\n            \"\n            class=\"a-btn a-btn--primary\"\n            (click)=\"onSearch()\"\n          >\n            <pry-icon iconSvg=\"search-line\"></pry-icon>\n            {{ '@pry.search.button.search' | i18n }}\n          </button>\n        </div>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #noSearch>\n      <div class=\"o-pry-search-tools__content__full\">\n        <pry-search-home\n          class=\"o-pry-search-home\"\n          [isMoreList]=\"isMoreList\"\n          [searchFulltextTpl]=\"searchFulltextTpl\"\n          (changeListView)=\"onChangeListView($event)\"\n          (changeSearchCriteria)=\"onSearchCriteria()\"\n        ></pry-search-home>\n        <ng-template #searchFulltextTpl>\n          <pry-search-fulltext mode=\"vertical\" (searchChange)=\"onSearchFulltextChange($event)\"></pry-search-fulltext>\n        </ng-template>\n      </div>\n    </ng-template>\n  </div>\n  <div class=\"o-pry-search-tools__footer\" [class.is-close]=\"searchToolsClose\">\n    <pry-save-query-button\n      [editInProgress]=\"editInProgress$ | async\"\n      [currentEdit]=\"currentEdit$ | async\"\n      [currentEditType]=\"currentEditType$ | async\"\n      [fulltextValid]=\"isSearchFulltextValid\"\n      [multiValid]=\"searchMultiClassValid$ | async\"\n      [monoValid]=\"searchMonoClassValid$ | async\"\n      [isNotFulltext]=\"isSearchCriteria\"\n      [isMonoSearch]=\"isSearchMono\"\n      [fulltextSearch]=\"searchFulltextTemp\"\n    ></pry-save-query-button>\n  </div>\n</div>\n\n<ng-template #infoTooltipBack>\n  <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipBack_searchTools\">\n    <span class=\"m-tooltip__text\"> Retour \u00E0 la liste des recherches </span>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pry-search-tools', template: "<div\n  class=\"o-pry-search-tools\"\n  [class.is-close]=\"searchToolsClose\"\n  [class.is-mono]=\"isNewMono || (isEditMono$ | async)\"\n>\n  <button\n    type=\"button\"\n    class=\"a-btn a-btn--icon-text -back a-tooltip\"\n    (click)=\"onSearchTools()\"\n    aria-pressed=\"false\"\n    *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n    [attr.data-tooltip]=\"'@pry.search.button.backSearch' | i18n\"\n    data-tooltip-position=\"bottom\"\n  >\n    <pry-icon iconSvg=\"arrow_back\" [width]=\"24\" [height]=\"24\" [animation]=\"false\"></pry-icon>\n    <span>{{ '@pry.search.button.backSearch' | i18n }}</span>\n  </button>\n  <div class=\"o-pry-search-tools__content\" [class.is-close]=\"searchToolsClose\">\n    <button\n      *ngIf=\"((editInProgress$ | async) && !(isRename$ | async)) || isSearchCriteria\"\n      class=\"a-btn a-btn--icon-text -link-like u-self-end\"\n      (click)=\"reset()\"\n      id=\"btn_reset\"\n    >\n      <pry-icon iconSvg=\"reset\" [width]=\"18\" [height]=\"18\"></pry-icon>\n      {{ '@pry.search.button.reset' | i18n }}\n    </button>\n    <ng-container *ngIf=\"editInProgress$ | async\">\n      <pry-share [ngModel]=\"(currentEdit$ | async)?.visibility\" (ngModelChange)=\"updateVisibility($event)\"></pry-share>\n    </ng-container>\n    <ng-container *ngIf=\"(editInProgress$ | async) && !(isRename$ | async) && !(loading$ | async); else noEdit\">\n      <pry-edit-named-query\n        (searchFulltextChange)=\"onSearchFulltextChange($event)\"\n        (cancelled)=\"onSearchTools()\"\n      ></pry-edit-named-query>\n    </ng-container>\n    <ng-template #noEdit>\n      <ng-container *ngIf=\"isSearchCriteria && !(loading$ | async); else noSearch\">\n        <pry-toggle\n          class=\"o-pry-search-tools__content__toggle\"\n          [ngModel]=\"isSearchMono\"\n          (ngModelChange)=\"onMonoSearch()\"\n          [alwaysActive]=\"true\"\n          mode=\"action\"\n        >\n          {{ (isSearchMono ? '@pry.search.button.mono' : '@pry.search.button.multi') | i18n }}\n        </pry-toggle>\n        <div class=\"o-pry-search-tools__content__full\">\n          <ng-container *ngIf=\"isSearchMono; else isMultiSearch\">\n            <pry-search-mono-class></pry-search-mono-class>\n          </ng-container>\n          <ng-template #isMultiSearch>\n            <pry-search-multi-class></pry-search-multi-class>\n          </ng-template>\n        </div>\n\n        <div class=\"o-pry-search-tools__content__button-search\">\n          <ng-container *ngIf=\"isSearchCriteria\">\n            <pry-choose-widget (selected)=\"selectWidget($event)\"></pry-choose-widget>\n          </ng-container>\n          <button class=\"a-btn a-btn--primary\" (click)=\"onSearchTools()\" *ngIf=\"!isSearchCriteria\">\n            {{ '@pry.search.button.cancel' | i18n }}\n          </button>\n          <button\n            [disabled]=\"\n              (!(searchMultiClassValid$ | async) && !isSearchMono) || (!(searchMonoClassValid$ | async) && isSearchMono)\n            \"\n            class=\"a-btn a-btn--primary\"\n            (click)=\"onSearch()\"\n          >\n            <pry-icon iconSvg=\"search-line\"></pry-icon>\n            {{ '@pry.search.button.search' | i18n }}\n          </button>\n        </div>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #noSearch>\n      <div class=\"o-pry-search-tools__content__full\">\n        <pry-search-home\n          class=\"o-pry-search-home\"\n          [isMoreList]=\"isMoreList\"\n          [searchFulltextTpl]=\"searchFulltextTpl\"\n          (changeListView)=\"onChangeListView($event)\"\n          (changeSearchCriteria)=\"onSearchCriteria()\"\n        ></pry-search-home>\n        <ng-template #searchFulltextTpl>\n          <pry-search-fulltext mode=\"vertical\" (searchChange)=\"onSearchFulltextChange($event)\"></pry-search-fulltext>\n        </ng-template>\n      </div>\n    </ng-template>\n  </div>\n  <div class=\"o-pry-search-tools__footer\" [class.is-close]=\"searchToolsClose\">\n    <pry-save-query-button\n      [editInProgress]=\"editInProgress$ | async\"\n      [currentEdit]=\"currentEdit$ | async\"\n      [currentEditType]=\"currentEditType$ | async\"\n      [fulltextValid]=\"isSearchFulltextValid\"\n      [multiValid]=\"searchMultiClassValid$ | async\"\n      [monoValid]=\"searchMonoClassValid$ | async\"\n      [isNotFulltext]=\"isSearchCriteria\"\n      [isMonoSearch]=\"isSearchMono\"\n      [fulltextSearch]=\"searchFulltextTemp\"\n    ></pry-save-query-button>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }]; }, propDecorators: { class: [{
                 type: HostBinding,
                 args: ['class.o-pry-search-tools-wrapper']
@@ -1858,7 +1861,10 @@ const enTranslations = {
                 or: 'or',
                 title: 'My search',
                 ssTitle: 'New search',
-                searchByCriteria: 'search by criteria'
+                searchByCriteria: 'search by criteria',
+                associatedWidget: 'widget associated with this search',
+                showAssociatedWidget: 'Show the widget associated with this search',
+                otherActions: 'Other actions'
             },
             attribute: {
                 title: 'Attribute: ',
@@ -1947,12 +1953,15 @@ const enTranslations = {
                 allClasses: 'All classes',
                 oneClass: 'One selected class',
                 manyClasses: '{{nb}} selected classes',
-                search: 'Search'
+                selectClass: 'Select class',
+                search: 'Search',
+                clear: 'Clear input'
             },
             multi: {
                 title: 'Add criterias',
                 addCondition: 'Add one criteria',
                 options: 'Options',
+                extraOptions: 'Extra options',
                 multiType: 'Kind of association',
                 search: 'Search',
                 requiredError: 'Value is missing',
@@ -1990,7 +1999,10 @@ const frTranslations = {
                 or: 'ou',
                 title: 'Mes recherches',
                 ssTitle: 'Nouvelle recherche',
-                searchByCriteria: 'Recherche par critères'
+                searchByCriteria: 'Recherche par critères',
+                associatedWidget: 'le widget associé à cette recherche',
+                showAssociatedWidget: 'Afficher le widget associé à cette recherche',
+                otherActions: 'Autres actions'
             },
             attribute: {
                 title: 'Attribut : ',
@@ -2079,12 +2091,15 @@ const frTranslations = {
                 allClasses: 'Toutes les classes',
                 oneClass: 'Une classe sélectionnée',
                 manyClasses: '{{nb}} classes sélectionnées',
-                search: 'Lancer la recherche'
+                selectClass: 'Sélectionner la classe',
+                search: 'Lancer la recherche',
+                clear: 'Effacer la saisie'
             },
             multi: {
                 title: 'Ajouter des critères',
                 addCondition: 'Ajouter un critère',
                 options: 'Options',
+                extraOptions: 'Options supplémentaires',
                 multiType: 'Associer les critères',
                 search: 'Rechercher',
                 requiredError: 'La valeur est manquante',