@cityway/basic-ui 1.0.1

package/fesm2022/cityway-basic-ui.mjs

@@ -0,0 +1,2092 @@
+import * as i1 from '@angular/common';
+import { CommonModule, NgTemplateOutlet, NgClass } from '@angular/common';
+import * as i0 from '@angular/core';
+import { inject, ElementRef, signal, EventEmitter, effect, Output, Input, Directive, HostBinding, Component, ViewChild, ContentChildren, Injectable, HostListener, Renderer2, output, TemplateRef, ContentChild, ViewChildren, Pipe } from '@angular/core';
+import * as i2 from '@ngx-translate/core';
+import { TranslateModule, TranslateService, TranslatePipe } from '@ngx-translate/core';
+import { BehaviorSubject, fromEvent } from 'rxjs';
+import * as i4 from '@angular-slider/ngx-slider';
+import { NgxSliderModule } from '@angular-slider/ngx-slider';
+import * as i2$1 from '@angular/forms';
+import { FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import * as i1$1 from '@ng-bootstrap/ng-bootstrap';
+import { NgbDropdownModule, NgbPopover } from '@ng-bootstrap/ng-bootstrap';
+import * as i3 from '@ng-select/ng-select';
+import { NgSelectModule } from '@ng-select/ng-select';
+import * as i1$2 from '@angular/router';
+
+class CollapseDirective {
+    set cwCollapse(value) {
+        this.collapsedSignal.set(value);
+    }
+    get cwCollapse() {
+        return this.collapsedSignal();
+    }
+    constructor() {
+        this.elementRef = inject(ElementRef);
+        // Utilisation de signals pour la réactivité
+        this.collapsedSignal = signal(false, ...(ngDevMode ? [{ debugName: "collapsedSignal" }] : []));
+        this.shown = new EventEmitter();
+        this.hidden = new EventEmitter();
+        // Effect pour réagir aux changements de collapsed
+        effect(() => {
+            const isCollapsed = this.collapsedSignal();
+            this.updateClasses(isCollapsed);
+        });
+    }
+    ngOnInit() {
+        this.elementRef.nativeElement.classList.add('collapse');
+        this.updateClasses(this.collapsedSignal());
+    }
+    updateClasses(isCollapsed) {
+        const element = this.elementRef.nativeElement;
+        if (isCollapsed) {
+            element.classList.remove('show');
+            this.hidden.emit();
+        }
+        else {
+            element.classList.add('show');
+            this.shown.emit();
+        }
+    }
+    toggle() {
+        this.collapsedSignal.update(value => !value);
+    }
+    show() {
+        this.collapsedSignal.set(false);
+    }
+    hide() {
+        this.collapsedSignal.set(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CollapseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: CollapseDirective, isStandalone: true, selector: "[cwCollapse]", inputs: { cwCollapse: "cwCollapse" }, outputs: { shown: "shown", hidden: "hidden" }, exportAs: ["cwCollapse"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CollapseDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[cwCollapse]',
+                    exportAs: 'cwCollapse',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [], propDecorators: { cwCollapse: [{
+                type: Input,
+                args: [{ required: false }]
+            }], shown: [{
+                type: Output
+            }], hidden: [{
+                type: Output
+            }] } });
+
+var IconSizeEnum;
+(function (IconSizeEnum) {
+    IconSizeEnum["5xl"] = "5xl";
+    IconSizeEnum["4xl"] = "4xl";
+    IconSizeEnum["3xl"] = "3xl";
+    IconSizeEnum["2xl"] = "2xl";
+    IconSizeEnum["xl"] = "xl";
+    IconSizeEnum["lg"] = "lg";
+    IconSizeEnum["md"] = "md";
+    IconSizeEnum["sm"] = "sm";
+    IconSizeEnum["xs"] = "xs";
+    IconSizeEnum["2xs"] = "2xs";
+    IconSizeEnum["3xs"] = "3xs";
+})(IconSizeEnum || (IconSizeEnum = {}));
+var IconTypeEnum;
+(function (IconTypeEnum) {
+    IconTypeEnum["default"] = "default";
+    IconTypeEnum["rounded"] = "rounded";
+})(IconTypeEnum || (IconTypeEnum = {}));
+var IconUiTypeEnum;
+(function (IconUiTypeEnum) {
+    IconUiTypeEnum["default"] = "default";
+    IconUiTypeEnum["light"] = "light";
+    IconUiTypeEnum["primary"] = "primary";
+    IconUiTypeEnum["invert"] = "invert";
+})(IconUiTypeEnum || (IconUiTypeEnum = {}));
+
+class IconComponent {
+    constructor() {
+        this.icon = 'cw-alert-help';
+        this.font = 'optyweb';
+        this.type = IconTypeEnum.default;
+        this.iconSize = IconSizeEnum['sm'];
+        this.iconCssClass = '';
+        this.iconUiType = IconUiTypeEnum.default;
+        this.iconTypeEnum = IconTypeEnum;
+    }
+    get hostClasses() {
+        if (this.type == IconTypeEnum.rounded) {
+            return 'icon-rounded icon-rounded-' + this.iconSize + ' icon-rounded-' + this.iconUiType;
+        }
+        else {
+            return 'icon icon-' + this.iconSize;
+        }
+    }
+    ngOnInit() {
+        this.iconClass = this.font + ' ' + this.icon;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IconComponent, isStandalone: true, selector: "cw-icon", inputs: { icon: "icon", font: "font", label: "label", type: "type", iconSize: "iconSize", iconCssClass: "iconCssClass", iconUiType: "iconUiType", iconColorCustom: "iconColorCustom" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "@if (type == iconTypeEnum.rounded) {\r\n      <span class=\"icon\">\r\n         <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\r\n      </span>\r\n    } @else {\r\n       <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\r\n    }\r\n\r\n<ng-template #icon>\r\n  <span [class]=\"iconClass + ' icon-span'\" [ngClass]=\"iconCssClass\" aria-hidden=\"true\" [attr.style]=\"iconColorCustom ? 'color: ' + iconColorCustom : null\"></span>\r\n  @if (label) {\r\n    <span class=\"visually-hidden\">{{ label }}</span>\r\n  }\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IconComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-icon', standalone: true, imports: [
+                        CommonModule
+                    ], template: "@if (type == iconTypeEnum.rounded) {\r\n      <span class=\"icon\">\r\n         <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\r\n      </span>\r\n    } @else {\r\n       <ng-container *ngTemplateOutlet=\"icon\"></ng-container>\r\n    }\r\n\r\n<ng-template #icon>\r\n  <span [class]=\"iconClass + ' icon-span'\" [ngClass]=\"iconCssClass\" aria-hidden=\"true\" [attr.style]=\"iconColorCustom ? 'color: ' + iconColorCustom : null\"></span>\r\n  @if (label) {\r\n    <span class=\"visually-hidden\">{{ label }}</span>\r\n  }\r\n</ng-template>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { icon: [{
+                type: Input
+            }], font: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], iconSize: [{
+                type: Input
+            }], iconCssClass: [{
+                type: Input
+            }], iconUiType: [{
+                type: Input
+            }], iconColorCustom: [{
+                type: Input
+            }], hostClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+var CardTypeEnum;
+(function (CardTypeEnum) {
+    CardTypeEnum["default"] = "default";
+    CardTypeEnum["light"] = "light";
+})(CardTypeEnum || (CardTypeEnum = {}));
+var CardTitleRankEnum;
+(function (CardTitleRankEnum) {
+    CardTitleRankEnum["h2"] = "h2";
+    CardTitleRankEnum["h3"] = "h3";
+})(CardTitleRankEnum || (CardTitleRankEnum = {}));
+
+class CardComponent {
+    constructor(cdRef) {
+        this.cdRef = cdRef;
+        this.type = CardTypeEnum.default;
+        this.titleRank = CardTitleRankEnum.h2;
+        this.collapsible = false;
+        this.collapsed = false;
+        this.collapseId = `collapse-${Math.random().toString(36).substring(2, 11)}`;
+        this.destroyOnHide = true;
+        this.collapseClicked = new EventEmitter();
+        this.showFooter = true;
+        this.titleRankEnum = CardTitleRankEnum;
+        this.typeEnum = CardTypeEnum;
+        this.isCollapsed = signal(false, ...(ngDevMode ? [{ debugName: "isCollapsed" }] : []));
+        this.shouldRenderBody = signal(true, ...(ngDevMode ? [{ debugName: "shouldRenderBody" }] : []));
+        this.iconSize = IconSizeEnum;
+    }
+    ngOnInit() {
+        this.isCollapsed.set(this.collapsed);
+        if (this.destroyOnHide && this.collapsed) {
+            this.shouldRenderBody.set(false);
+        }
+    }
+    ngAfterViewInit() {
+        this.showFooter = this.cardFooter.nativeElement && this.cardFooter.nativeElement.children.length > 0;
+        this.cdRef.detectChanges();
+    }
+    toggleCollapse() {
+        if (this.collapsible) {
+            const newCollapsedState = !this.isCollapsed();
+            this.updateCollapseState(newCollapsedState);
+        }
+    }
+    collapse() {
+        this.updateCollapseState(true);
+    }
+    expand() {
+        this.updateCollapseState(false);
+    }
+    updateCollapseState(collapsed) {
+        if (!collapsed && this.destroyOnHide && !this.shouldRenderBody()) {
+            this.shouldRenderBody.set(true);
+            this.cdRef.detectChanges();
+        }
+        this.isCollapsed.set(collapsed);
+        this.collapseClicked.emit(collapsed);
+        if (collapsed && this.destroyOnHide) {
+            setTimeout(() => {
+                if (this.isCollapsed()) {
+                    this.shouldRenderBody.set(false);
+                    this.cdRef.detectChanges();
+                }
+            }, 120);
+        }
+    }
+    get collapsed_state() {
+        return this.isCollapsed();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CardComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: CardComponent, isStandalone: true, selector: "cw-card", inputs: { title: "title", type: "type", titleRank: "titleRank", collapsible: "collapsible", collapsed: "collapsed", collapseId: "collapseId", destroyOnHide: "destroyOnHide" }, outputs: { collapseClicked: "collapseClicked" }, viewQueries: [{ propertyName: "collapseDirective", first: true, predicate: ["collapse"], descendants: true }, { propertyName: "cardFooter", first: true, predicate: ["cardFooter"], descendants: true }], ngImport: i0, template: "<div class=\"card\" [class.card-collapse]=\"collapsible\" [class.card-light]=\"type == typeEnum.light\">\n  @if (title) {\n    <div class=\"card-header\" [class.card-header-collapse]=\"collapsible\"\n      [class.card-header-collapsed]=\"collapsible && isCollapsed()\">\n      <ng-container *ngTemplateOutlet=\"header\"></ng-container>\n    </div>\n  }\n\n   @if (shouldRenderBody()) {\n    <div class=\"card-body\" [cwCollapse]=\"isCollapsed()\" [id]=\"collapseId\" #collapse=\"cwCollapse\">\n      <ng-content></ng-content>\n    </div>\n  }\n\n  @if (showFooter) {\n    <div class=\"card-footer\" #cardFooter>\n      <ng-content select=\"[card-footer]\"></ng-content>\n    </div>\n  }\n</div>\n\n<ng-template #header>\n  @if (titleRank == titleRankEnum.h2) {\n    <h2>{{title}}</h2>\n  }\n  @else if (titleRank == titleRankEnum.h3) {\n    <h3>{{title}}</h3>\n  }\n\n  <div class=\"card-header-custom-area\">\n    <ng-content select=\"[header-custom-area]\"></ng-content>\n  </div>\n\n  @if (collapsible) {\n    <button type=\"button\" class=\"btn btn-collapse stretched-link\" (click)=\"toggleCollapse()\"\n      [attr.aria-expanded]=\"!isCollapsed()\" [class.collapsed]=\"isCollapsed()\" [attr.aria-controls]=\"collapseId\">\n      <cw-icon icon=\"cw-nav-expand2\" label=\"D\u00E9plier/Plier\" [iconSize]=\"iconSize['xs']\"></cw-icon>\n      <!-- // TODO trad -->\n    </button>\n  }\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CollapseDirective, selector: "[cwCollapse]", inputs: ["cwCollapse"], outputs: ["shown", "hidden"], exportAs: ["cwCollapse"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-card', standalone: true, imports: [
+                        CommonModule,
+                        CollapseDirective,
+                        IconComponent
+                    ], template: "<div class=\"card\" [class.card-collapse]=\"collapsible\" [class.card-light]=\"type == typeEnum.light\">\n  @if (title) {\n    <div class=\"card-header\" [class.card-header-collapse]=\"collapsible\"\n      [class.card-header-collapsed]=\"collapsible && isCollapsed()\">\n      <ng-container *ngTemplateOutlet=\"header\"></ng-container>\n    </div>\n  }\n\n   @if (shouldRenderBody()) {\n    <div class=\"card-body\" [cwCollapse]=\"isCollapsed()\" [id]=\"collapseId\" #collapse=\"cwCollapse\">\n      <ng-content></ng-content>\n    </div>\n  }\n\n  @if (showFooter) {\n    <div class=\"card-footer\" #cardFooter>\n      <ng-content select=\"[card-footer]\"></ng-content>\n    </div>\n  }\n</div>\n\n<ng-template #header>\n  @if (titleRank == titleRankEnum.h2) {\n    <h2>{{title}}</h2>\n  }\n  @else if (titleRank == titleRankEnum.h3) {\n    <h3>{{title}}</h3>\n  }\n\n  <div class=\"card-header-custom-area\">\n    <ng-content select=\"[header-custom-area]\"></ng-content>\n  </div>\n\n  @if (collapsible) {\n    <button type=\"button\" class=\"btn btn-collapse stretched-link\" (click)=\"toggleCollapse()\"\n      [attr.aria-expanded]=\"!isCollapsed()\" [class.collapsed]=\"isCollapsed()\" [attr.aria-controls]=\"collapseId\">\n      <cw-icon icon=\"cw-nav-expand2\" label=\"D\u00E9plier/Plier\" [iconSize]=\"iconSize['xs']\"></cw-icon>\n      <!-- // TODO trad -->\n    </button>\n  }\n</ng-template>\n" }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { title: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], titleRank: [{
+                type: Input
+            }], collapsible: [{
+                type: Input
+            }], collapsed: [{
+                type: Input
+            }], collapseId: [{
+                type: Input
+            }], destroyOnHide: [{
+                type: Input
+            }], collapseClicked: [{
+                type: Output
+            }], collapseDirective: [{
+                type: ViewChild,
+                args: ['collapse']
+            }], cardFooter: [{
+                type: ViewChild,
+                args: ['cardFooter']
+            }] } });
+
+class AccordionComponent {
+    constructor() {
+        this.closeOthers = true;
+        this.allowMultiple = false;
+        this.destroyOnHide = true; // Nouvelle option pour l'accordéon
+        this.panelOpened = new EventEmitter();
+        this.panelClosed = new EventEmitter();
+        this.cardMap = new Map();
+    }
+    ngAfterContentInit() {
+        this.cards.forEach(card => {
+            if (!card.collapsible) {
+                card.collapsible = true;
+            }
+            if (card.destroyOnHide === true) {
+                card.destroyOnHide = this.destroyOnHide;
+            }
+            this.cardMap.set(card.collapseId, card);
+            card.collapseClicked.subscribe((isCollapsed) => {
+                this.onCardToggle(card.collapseId, isCollapsed);
+            });
+        });
+    }
+    openPanel(panelId) {
+        const card = this.cardMap.get(panelId);
+        if (card) {
+            if (this.shouldCloseOthers()) {
+                this.closeAllExcept(panelId);
+            }
+            card.expand();
+        }
+    }
+    closePanel(panelId) {
+        const card = this.cardMap.get(panelId);
+        if (card) {
+            card.collapse();
+        }
+    }
+    togglePanel(panelId) {
+        const card = this.cardMap.get(panelId);
+        if (card) {
+            if (card.collapsed_state) {
+                this.openPanel(panelId);
+            }
+            else {
+                this.closePanel(panelId);
+            }
+        }
+    }
+    closeAll() {
+        this.cards.forEach(card => card.collapse());
+    }
+    openAll() {
+        if (!this.shouldCloseOthers()) {
+            this.cards.forEach(card => card.expand());
+        }
+    }
+    onCardToggle(panelId, isCollapsed) {
+        if (!isCollapsed) {
+            if (this.shouldCloseOthers()) {
+                this.closeAllExcept(panelId);
+            }
+            this.panelOpened.emit(panelId);
+        }
+        else {
+            this.panelClosed.emit(panelId);
+        }
+    }
+    closeAllExcept(exceptId) {
+        this.cards.forEach(card => {
+            if (card.collapseId !== exceptId) {
+                card.collapse();
+            }
+        });
+    }
+    shouldCloseOthers() {
+        return this.closeOthers && !this.allowMultiple;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: AccordionComponent, isStandalone: true, selector: "cw-accordion", inputs: { closeOthers: "closeOthers", allowMultiple: "allowMultiple", destroyOnHide: "destroyOnHide" }, outputs: { panelOpened: "panelOpened", panelClosed: "panelClosed" }, queries: [{ propertyName: "cards", predicate: CardComponent }], ngImport: i0, template: "<div class=\"accordion\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AccordionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-accordion', standalone: true, imports: [CommonModule], template: "<div class=\"accordion\">\r\n  <ng-content></ng-content>\r\n</div>\r\n" }]
+        }], propDecorators: { closeOthers: [{
+                type: Input
+            }], allowMultiple: [{
+                type: Input
+            }], destroyOnHide: [{
+                type: Input
+            }], panelOpened: [{
+                type: Output
+            }], panelClosed: [{
+                type: Output
+            }], cards: [{
+                type: ContentChildren,
+                args: [CardComponent]
+            }] } });
+
+var AlertTypeEnum;
+(function (AlertTypeEnum) {
+    AlertTypeEnum["info"] = "info";
+    AlertTypeEnum["success"] = "success";
+    AlertTypeEnum["warning"] = "warning";
+    AlertTypeEnum["danger"] = "danger";
+})(AlertTypeEnum || (AlertTypeEnum = {}));
+
+var IconNotifSizeEnum;
+(function (IconNotifSizeEnum) {
+    IconNotifSizeEnum["5xl"] = "5xl";
+    IconNotifSizeEnum["md"] = "md";
+})(IconNotifSizeEnum || (IconNotifSizeEnum = {}));
+var IconNotifTypeEnum;
+(function (IconNotifTypeEnum) {
+    IconNotifTypeEnum["info"] = "info";
+    IconNotifTypeEnum["success"] = "success";
+    IconNotifTypeEnum["warning"] = "warning";
+    IconNotifTypeEnum["danger"] = "danger";
+    IconNotifTypeEnum["careful"] = "careful";
+})(IconNotifTypeEnum || (IconNotifTypeEnum = {}));
+
+class IconNotificationComponent {
+    constructor() {
+        this.type = IconNotifTypeEnum.info;
+        this.iconSize = IconNotifSizeEnum['md'];
+    }
+    get hostClasses() {
+        return 'icon-rounded icon-rounded-' + this.iconSize + ' icon-notification-' + this.type;
+    }
+    ngOnInit() {
+        switch (this.type) {
+            case IconNotifTypeEnum.info:
+                this.icon = 'cw-alert-info2';
+                this.label = 'Informatiion';
+                break;
+            case IconNotifTypeEnum.success:
+                this.icon = 'cw-alert-success2';
+                this.label = 'Succès';
+                break;
+            case IconNotifTypeEnum.warning:
+                this.icon = 'cw-event-warning';
+                this.label = 'Avertisement';
+                break;
+            case IconNotifTypeEnum.danger:
+                this.icon = 'cw-toolbar-close1';
+                this.label = 'Erreur';
+                break;
+            case IconNotifTypeEnum.careful:
+                this.icon = 'cw-alert-warning';
+                this.label = 'Attention';
+                break;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IconNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: IconNotificationComponent, isStandalone: true, selector: "cw-icon-notification", inputs: { type: "type", iconSize: "iconSize" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "\r\n<span class=\"icon\">\r\n  <span class=\"icon-span optyweb\" [ngClass]=\"icon\" aria-hidden=\"true\" [title]=\"label\"></span>\r\n  <span class=\"visually-hidden\">{{ label }}</span>\r\n</span>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IconNotificationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-icon-notification', standalone: true, imports: [
+                        CommonModule
+                    ], template: "\r\n<span class=\"icon\">\r\n  <span class=\"icon-span optyweb\" [ngClass]=\"icon\" aria-hidden=\"true\" [title]=\"label\"></span>\r\n  <span class=\"visually-hidden\">{{ label }}</span>\r\n</span>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { type: [{
+                type: Input
+            }], iconSize: [{
+                type: Input
+            }], hostClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class AlertComponent {
+    constructor(cdRef) {
+        this.cdRef = cdRef;
+        this.type = AlertTypeEnum.info;
+        this.isDismissible = false;
+        this.cssClass = '';
+        this.close = new EventEmitter();
+        this.isVisible = true;
+        this.showContent = true;
+        this.iconSize = IconSizeEnum;
+    }
+    ngOnInit() {
+        this.dataTest = this.dataTest ? this.dataTest : 'alert' + this.type;
+        switch (this.type) {
+            case AlertTypeEnum.info:
+                this.icon = "cw-alert-info2";
+                this.iconNotifType = IconNotifTypeEnum.info;
+                break;
+            case AlertTypeEnum.danger:
+                this.icon = "cw-toolbar-close1";
+                this.iconNotifType = IconNotifTypeEnum.danger;
+                break;
+            case AlertTypeEnum.warning:
+                this.icon = "cw-event-warning";
+                this.iconNotifType = IconNotifTypeEnum.warning;
+                break;
+            case AlertTypeEnum.success:
+                this.icon = "cw-alert-success2";
+                this.iconNotifType = IconNotifTypeEnum.success;
+                break;
+            default:
+                this.icon = "cw-alert-info2";
+                this.iconNotifType = IconNotifTypeEnum.info;
+                break;
+        }
+    }
+    ngAfterViewInit() {
+        this.showContent = this.alertContent.nativeElement && this.alertContent.nativeElement.children.length > 0;
+        this.cdRef.detectChanges();
+    }
+    closeAlert() {
+        this.isVisible = false;
+        this.close.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlertComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AlertComponent, isStandalone: true, selector: "cw-alert", inputs: { type: "type", title: "title", isDismissible: "isDismissible", cssClass: "cssClass", dataTest: "dataTest" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "alertContent", first: true, predicate: ["alertContent"], descendants: true }], ngImport: i0, template: "@if (isVisible) {\r\n  <div [class]=\"'alert alert-' + type + ' '+ cssClass\" [ngClass]=\"{ 'alert-dismissible fade show': isDismissible }\"\r\n    [attr.data-test-ctw]=\"dataTest\">\r\n    <cw-icon-notification [type]=\"iconNotifType\"></cw-icon-notification>\r\n    <div class=\"alert-content\">\r\n      @if (title) {\r\n        <div class=\"fw-bold\">{{ title }}</div>\r\n      }\r\n\r\n      @if (showContent) {\r\n        <p class=\"mb-none\" #alertContent>\r\n          <ng-content></ng-content>\r\n        </p>\r\n      }\r\n    </div>\r\n    @if (isDismissible) {\r\n      <button type=\"button\" class=\"btn-close\" (click)=\"closeAlert()\"\r\n        [attr.aria-label]=\"'_COMMON._ACTION.CLOSE' | translate\"\r\n        [attr.data-test-ctw]=\"'close-' + dataTest\">\r\n        <cw-icon [label]=\"'_COMMON._ACTION.CLOSE' | translate\" [iconSize]=\"iconSize['2xs']\" icon=\"cw-toolbar-close1\"></cw-icon>\r\n      </button>\r\n    }\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: IconNotificationComponent, selector: "cw-icon-notification", inputs: ["type", "iconSize"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlertComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-alert', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule,
+                        IconNotificationComponent,
+                        IconComponent
+                    ], template: "@if (isVisible) {\r\n  <div [class]=\"'alert alert-' + type + ' '+ cssClass\" [ngClass]=\"{ 'alert-dismissible fade show': isDismissible }\"\r\n    [attr.data-test-ctw]=\"dataTest\">\r\n    <cw-icon-notification [type]=\"iconNotifType\"></cw-icon-notification>\r\n    <div class=\"alert-content\">\r\n      @if (title) {\r\n        <div class=\"fw-bold\">{{ title }}</div>\r\n      }\r\n\r\n      @if (showContent) {\r\n        <p class=\"mb-none\" #alertContent>\r\n          <ng-content></ng-content>\r\n        </p>\r\n      }\r\n    </div>\r\n    @if (isDismissible) {\r\n      <button type=\"button\" class=\"btn-close\" (click)=\"closeAlert()\"\r\n        [attr.aria-label]=\"'_COMMON._ACTION.CLOSE' | translate\"\r\n        [attr.data-test-ctw]=\"'close-' + dataTest\">\r\n        <cw-icon [label]=\"'_COMMON._ACTION.CLOSE' | translate\" [iconSize]=\"iconSize['2xs']\" icon=\"cw-toolbar-close1\"></cw-icon>\r\n      </button>\r\n    }\r\n  </div>\r\n}\r\n" }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { type: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], isDismissible: [{
+                type: Input
+            }], cssClass: [{
+                type: Input
+            }], dataTest: [{
+                type: Input
+            }], close: [{
+                type: Output
+            }], alertContent: [{
+                type: ViewChild,
+                args: ['alertContent']
+            }] } });
+
+class FocusTrackerService {
+    constructor() {
+        this.lastFocusedElement = null;
+        this.focusListener = this.onFocus.bind(this);
+        document.addEventListener('focus', this.focusListener, true);
+    }
+    onFocus(event) {
+        const target = event.target;
+        if (target) {
+            this.lastFocusedElement = target;
+        }
+    }
+    getFocusedElement() {
+        return this.lastFocusedElement;
+    }
+    ngOnDestroy() {
+        document.removeEventListener('focus', this.focusListener, true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FocusTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FocusTrackerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FocusTrackerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class ToastService {
+    constructor() {
+        this.focusService = inject(FocusTrackerService);
+        this.toasts = [];
+        this.autohideTimers = new Map();
+    }
+    show(options) {
+        if (!this.canShowMessage(options.message)) {
+            return;
+        }
+        const toast = {
+            id: crypto.randomUUID(),
+            type: options.type,
+            title: options.title,
+            message: options.message,
+            autohide: options.autohide ?? false,
+            action: options.action,
+        };
+        this.toasts.push(toast);
+        this.triggeringElement = this.focusService.getFocusedElement();
+        // Gestion du autohide
+        if (toast.autohide) {
+            const toastId = toast.id; // Capturer l'ID
+            const timer = setTimeout(() => {
+                this.removeById(toastId);
+            }, 5000);
+            this.autohideTimers.set(toastId, timer);
+        }
+    }
+    remove(toast) {
+        this.removeById(toast.id);
+    }
+    removeById(toastId) {
+        // Nettoyer le timer s'il existe
+        const timer = this.autohideTimers.get(toastId);
+        if (timer) {
+            clearTimeout(timer);
+            this.autohideTimers.delete(toastId);
+        }
+        this.toasts = this.toasts.filter(t => t.id !== toastId);
+        // Ne restaurer le focus que si c'était une action manuelle
+        if (timer === undefined || this.autohideTimers.has(toastId) === false) {
+            this.triggeringElement?.focus();
+        }
+    }
+    clear() {
+        // Nettoyer tous les timers
+        this.autohideTimers.forEach(timer => clearTimeout(timer));
+        this.autohideTimers.clear();
+        this.toasts = [];
+    }
+    canShowMessage(message) {
+        if (!this.lastToast) {
+            this.setLastToast(message);
+            return true;
+        }
+        const limit = new Date(this.lastToast.date);
+        limit.setSeconds(limit.getSeconds() + 1);
+        if (new Date() > limit || message !== this.lastToast.message) {
+            this.setLastToast(message);
+            return true;
+        }
+        return false;
+    }
+    setLastToast(message) {
+        this.lastToast = { message, date: new Date() };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ToastService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ToastService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class ToastComponent {
+    constructor() {
+        this.toastService = inject(ToastService);
+        this.elRef = inject(ElementRef);
+        this.action = new EventEmitter();
+        this.closed = new EventEmitter();
+    }
+    ngAfterViewInit() {
+        const elemPosition = this.elRef.nativeElement.getBoundingClientRect();
+        document.addEventListener("scroll", (event) => {
+            if (window.scrollY >= elemPosition.top * 2) {
+                this.elRef.nativeElement.classList.remove('is-absolute');
+            }
+            else {
+                this.elRef.nativeElement.classList.add('is-absolute');
+            }
+        });
+    }
+    onAction(toast) {
+        if (!toast?.action) {
+            return;
+        }
+        this.action.emit(toast.action);
+    }
+    close() {
+        this.closed.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ToastComponent, isStandalone: true, selector: "cw-toast", outputs: { action: "action", closed: "closed" }, host: { attributes: { "role": "alert" }, properties: { "class.toast": "true" } }, ngImport: i0, template: "@for (toast of toastService.toasts; track toast.id) {\r\n  <cw-alert [type]=\"toast.type\" [isDismissible]=\"true\" [title]=\"toast.title\" (close)=\"toastService.remove(toast)\" [dataTest]=\"'toast-'+ toast.type\">\r\n    <span [innerHTML]=\"toast.message\"></span>&nbsp;\r\n    @if (toast.action) {\r\n      <a href=\"javascript:void(0);\" (click)=\"onAction(toast)\" class=\"alert-link\">{{ toast.action.label }}</a>\r\n    }\r\n  </cw-alert>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AlertComponent, selector: "cw-alert", inputs: ["type", "title", "isDismissible", "cssClass", "dataTest"], outputs: ["close"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ToastComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-toast', standalone: true, imports: [
+                        CommonModule,
+                        AlertComponent
+                    ], host: { '[class.toast]': 'true', role: 'alert' }, template: "@for (toast of toastService.toasts; track toast.id) {\r\n  <cw-alert [type]=\"toast.type\" [isDismissible]=\"true\" [title]=\"toast.title\" (close)=\"toastService.remove(toast)\" [dataTest]=\"'toast-'+ toast.type\">\r\n    <span [innerHTML]=\"toast.message\"></span>&nbsp;\r\n    @if (toast.action) {\r\n      <a href=\"javascript:void(0);\" (click)=\"onAction(toast)\" class=\"alert-link\">{{ toast.action.label }}</a>\r\n    }\r\n  </cw-alert>\r\n}\r\n" }]
+        }], propDecorators: { action: [{
+                type: Output
+            }], closed: [{
+                type: Output
+            }] } });
+
+var BadgeTypeEnum;
+(function (BadgeTypeEnum) {
+    // Light variants
+    BadgeTypeEnum["lightInfo"] = "light-info";
+    BadgeTypeEnum["lightSuccess"] = "light-success";
+    BadgeTypeEnum["lightWarning"] = "light-warning";
+    BadgeTypeEnum["lightDanger"] = "light-danger";
+    BadgeTypeEnum["lightLight"] = "light-light";
+    // Heavy variants
+    BadgeTypeEnum["heavyPrimary"] = "heavy-primary";
+    BadgeTypeEnum["heavyInfo"] = "heavy-info";
+    BadgeTypeEnum["heavySuccess"] = "heavy-success";
+    BadgeTypeEnum["heavyWarning"] = "heavy-warning";
+    BadgeTypeEnum["heavyDanger"] = "heavy-danger";
+    BadgeTypeEnum["heavyDark"] = "heavy-dark";
+    BadgeTypeEnum["heavyLight"] = "heavy-light";
+    BadgeTypeEnum["heavyDisabled"] = "heavy-disabled";
+})(BadgeTypeEnum || (BadgeTypeEnum = {}));
+var BadgePositionEnum;
+(function (BadgePositionEnum) {
+    BadgePositionEnum["left"] = "left";
+    BadgePositionEnum["right"] = "right";
+})(BadgePositionEnum || (BadgePositionEnum = {}));
+
+class BadgeComponent {
+    constructor() {
+        this.badgePositionEnum = BadgePositionEnum;
+        this.iconPosition = this.badgePositionEnum.left;
+        this.cssClass = '';
+        this.iconSizeEnum = IconSizeEnum;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: BadgeComponent, isStandalone: true, selector: "cw-badge", inputs: { type: "type", label: "label", withIcon: "withIcon", iconPosition: "iconPosition", cssClass: "cssClass", dataTest: "dataTest" }, ngImport: i0, template: "<div [class]=\"'badge badge-' + type + ' '+ cssClass\" [attr.data-test-ctw]=\"dataTest ? dataTest : null\">\r\n\r\n  @if (withIcon && iconPosition === badgePositionEnum.left) {\r\n    <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['2xs']\"></cw-icon>\r\n  }\r\n\r\n  @if (label) {\r\n    {{ label }}\r\n  }\r\n\r\n  @if (withIcon && iconPosition === badgePositionEnum.right) {\r\n    <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['2xs']\"></cw-icon>\r\n  }\r\n</div>\r\n", dependencies: [{ kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-badge', standalone: true, imports: [IconComponent], template: "<div [class]=\"'badge badge-' + type + ' '+ cssClass\" [attr.data-test-ctw]=\"dataTest ? dataTest : null\">\r\n\r\n  @if (withIcon && iconPosition === badgePositionEnum.left) {\r\n    <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['2xs']\"></cw-icon>\r\n  }\r\n\r\n  @if (label) {\r\n    {{ label }}\r\n  }\r\n\r\n  @if (withIcon && iconPosition === badgePositionEnum.right) {\r\n    <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['2xs']\"></cw-icon>\r\n  }\r\n</div>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { type: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], withIcon: [{
+                type: Input
+            }], iconPosition: [{
+                type: Input
+            }], cssClass: [{
+                type: Input
+            }], dataTest: [{
+                type: Input
+            }] } });
+
+class ClickOutsideDirective {
+    onClick(event) {
+        const target = event.target;
+        const clickedInside = this.elementRef.nativeElement.contains(target);
+        if (!clickedInside) {
+            this.clickOutside.emit();
+        }
+    }
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+        this.clickOutside = new EventEmitter();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ClickOutsideDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: ClickOutsideDirective, isStandalone: true, selector: "[clickOutside]", outputs: { clickOutside: "clickOutside" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ClickOutsideDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[clickOutside]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { clickOutside: [{
+                type: Output
+            }], onClick: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }] } });
+
+var FoButtonTypeEnum;
+(function (FoButtonTypeEnum) {
+    FoButtonTypeEnum["primary"] = "primary";
+    FoButtonTypeEnum["secondary"] = "secondary";
+    FoButtonTypeEnum["link"] = "link";
+})(FoButtonTypeEnum || (FoButtonTypeEnum = {}));
+var BoButtonTypeEnum;
+(function (BoButtonTypeEnum) {
+    BoButtonTypeEnum["primary"] = "primary";
+    BoButtonTypeEnum["secondary"] = "secondary";
+    BoButtonTypeEnum["link"] = "link";
+    BoButtonTypeEnum["info"] = "info";
+    BoButtonTypeEnum["warning"] = "warning";
+    BoButtonTypeEnum["success"] = "success";
+    BoButtonTypeEnum["danger"] = "danger";
+    BoButtonTypeEnum["dangerOutline"] = "danger-outline";
+    BoButtonTypeEnum["light"] = "light";
+})(BoButtonTypeEnum || (BoButtonTypeEnum = {}));
+var ButtonIconSizeEnum;
+(function (ButtonIconSizeEnum) {
+    ButtonIconSizeEnum["default"] = "default";
+    ButtonIconSizeEnum["small"] = "small";
+    ButtonIconSizeEnum["xsmall"] = "xsmall";
+})(ButtonIconSizeEnum || (ButtonIconSizeEnum = {}));
+var ButtonPositionEnum;
+(function (ButtonPositionEnum) {
+    ButtonPositionEnum["left"] = "left";
+    ButtonPositionEnum["right"] = "right";
+})(ButtonPositionEnum || (ButtonPositionEnum = {}));
+var TypeTooltipEnum;
+(function (TypeTooltipEnum) {
+    TypeTooltipEnum["tooltip"] = "tooltip";
+    TypeTooltipEnum["popover"] = "popover";
+})(TypeTooltipEnum || (TypeTooltipEnum = {}));
+var TriggerTooltipEnum;
+(function (TriggerTooltipEnum) {
+    TriggerTooltipEnum["click"] = "click";
+    TriggerTooltipEnum["hover"] = "hover";
+})(TriggerTooltipEnum || (TriggerTooltipEnum = {}));
+
+class ResponsiveService {
+    constructor() {
+        this.checkIsMobileResolution$ = new BehaviorSubject(this.checkIsMobileResolution());
+        fromEvent(window, 'resize').subscribe(e => {
+            this.checkIsMobileResolution$.next(this.checkIsMobileResolution());
+        });
+    }
+    checkIsMobileResolution() {
+        return window.innerWidth < 768;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResponsiveService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResponsiveService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResponsiveService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+class UtilsHelper {
+    static slugify(text) {
+        if (!text)
+            return '';
+        return text
+            .normalize('NFD')
+            .toLowerCase()
+            .trim()
+            .replace(/[\u0300-\u036f]/g, '')
+            .replace(/[^a-z0-9]+/g, '-')
+            .replace(/^-+|-+$/g, '');
+    }
+}
+
+class DropdownItemDirective {
+    constructor() {
+        this.elementRef = inject(ElementRef);
+    }
+    ngOnInit() {
+        this.elementRef.nativeElement.classList.add('dropdown-item');
+        this.elementRef.nativeElement.setAttribute('tabindex', '0');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DropdownItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: DropdownItemDirective, isStandalone: true, selector: "[cwDropdownItem]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DropdownItemDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[cwDropdownItem]' }]
+        }] });
+class ButtonComponent {
+    constructor() {
+        this.renderer = inject(Renderer2);
+        this.responsiveService = inject(ResponsiveService);
+        this.buttonPositionEnum = ButtonPositionEnum;
+        this.id = '';
+        this.isDropdown = false;
+        this.withIcon = '';
+        this.withOnlyIcon = false;
+        this.iconSize = ButtonIconSizeEnum.default;
+        this.iconPosition = this.buttonPositionEnum.left;
+        this.dropdownPosition = this.buttonPositionEnum.right;
+        this.isMinWidth = false;
+        this.isDisabled = false;
+        this.withSpinner = false;
+        this.cssClass = '';
+        this.withTooltip = false;
+        this.tooltipText = '';
+        this.tooltipTitle = '';
+        this.tooltipTrigger = TriggerTooltipEnum.hover;
+        this.tooltipPosition = this.buttonPositionEnum.right;
+        this.tooltipType = TypeTooltipEnum.tooltip;
+        this.btnAction = new EventEmitter();
+        this.dropDownClicked = new EventEmitter();
+        this.isLoading = false;
+        this.iconSizeEnum = IconSizeEnum;
+        this.iconType = IconTypeEnum;
+        this.iconUiType = IconUiTypeEnum;
+        this.buttonIconSizeEnum = ButtonIconSizeEnum;
+        this.placementCss = '';
+        this.isOpen = false;
+        this.isTooltipOpened = false;
+        this.typeTooltipEnum = TypeTooltipEnum;
+        this.focusOutInitialized = false;
+        this.renderer.listen('window', 'click', (e) => {
+            const target = e.target;
+            if (target.classList.contains('dropdown-item')) {
+                this.onClickOutside();
+            }
+        });
+    }
+    ngOnInit() {
+        this.responsiveService.checkIsMobileResolution$.subscribe({
+            next: () => {
+                this.getPlacement(this.dropdownPosition);
+            }
+        });
+        if (this.withTooltip) {
+            this.tooltipRandomId = this.getRandomId(1, 10000);
+        }
+        this.dataTest ??= `btn-${UtilsHelper.slugify(this.label)}`;
+    }
+    getButtonClasses() {
+        return {
+            'btn-min-width': this.isMinWidth,
+            'btn-icon': this.withOnlyIcon,
+            [`btn-icon-${this.iconSize}`]: !!this.iconSize && this.withOnlyIcon
+        };
+    }
+    onBtnAction() {
+        this.btnAction.emit();
+        if (this.withSpinner) {
+            this.isLoading = !this.isLoading;
+        }
+    }
+    toggleDropdown() {
+        this.getPlacement(this.dropdownPosition);
+        this.setAriaExpanded();
+        this.dropdown?.nativeElement.classList.toggle("show");
+        this.dropdownMenu.nativeElement.classList.toggle("show");
+        this.isOpen = !this.isOpen;
+        this.dropDownClicked.emit(this.isOpen);
+        if (this.isOpen && !this.focusOutInitialized) {
+            this.focusOut(this.dropdownMenu.nativeElement);
+            this.focusOutInitialized = true;
+        }
+    }
+    onClickOutside() {
+        this.dropdownToggle?.nativeElement.setAttribute('aria-expanded', 'false');
+        this.dropdown?.nativeElement.classList.remove("show");
+        this.dropdownMenu.nativeElement.classList.remove("show");
+        this.isOpen = false;
+        this.dropDownClicked.emit(this.isOpen);
+    }
+    setAriaExpanded() {
+        const button = this.dropdownToggle.nativeElement;
+        const currentAriaExpanded = button.getAttribute('aria-expanded') === 'true';
+        button.setAttribute('aria-expanded', (!currentAriaExpanded).toString());
+    }
+    getPlacement(placement) {
+        switch (placement) {
+            case ButtonPositionEnum.right:
+                return this.placementCss = 'dropdown-menu-right';
+            case ButtonPositionEnum.left:
+                return this.placementCss = 'dropdown-menu-left';
+            default:
+                return null;
+        }
+    }
+    // Fermer la dropdown si on focus out en tab ou shift tab
+    focusOut(element) {
+        const focusableEls1 = element.querySelectorAll('a[href], button, textarea, input[type="text"],' +
+            'input[type="radio"]:checked, input[type="checkbox"], select');
+        const focusableEls = Array.from(focusableEls1)
+            .filter((el) => !el.disabled);
+        const firstFocusableEl = focusableEls[0];
+        const lastFocusableEl = focusableEls[focusableEls.length - 1];
+        element.addEventListener('keydown', (e) => {
+            const isTabPressed = e.key === 'Tab'; // isTabPressed
+            if (!isTabPressed)
+                return;
+            if (e.shiftKey) /* shift + tab */ {
+                if (document.activeElement === firstFocusableEl) {
+                    this.toggleDropdown();
+                }
+            }
+            else /* tab */ {
+                if (document.activeElement === lastFocusableEl) {
+                    this.toggleDropdown();
+                }
+            }
+        });
+    }
+    showTooltip() {
+        if (this.tooltipTrigger === 'click') {
+            this.isTooltipOpened = !this.isTooltipOpened;
+        }
+        else {
+            this.isTooltipOpened = true;
+        }
+    }
+    hideTooltip() {
+        if (this.tooltipTrigger === 'hover') {
+            this.isTooltipOpened = false;
+        }
+    }
+    onTooltipClickOutside() {
+        if (this.tooltipTrigger === 'click') {
+            this.isTooltipOpened = false;
+        }
+    }
+    getRandomId(min, max) {
+        return Math.floor(Math.random() * (max - min + 1)) + min;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ButtonComponent, isStandalone: true, selector: "cw-button", inputs: { type: "type", label: "label", id: "id", isDropdown: "isDropdown", withIcon: "withIcon", withOnlyIcon: "withOnlyIcon", iconSize: "iconSize", iconPosition: "iconPosition", dropdownPosition: "dropdownPosition", isMinWidth: "isMinWidth", isDisabled: "isDisabled", withSpinner: "withSpinner", cssClass: "cssClass", dataTest: "dataTest", withTooltip: "withTooltip", tooltipText: "tooltipText", tooltipTitle: "tooltipTitle", tooltipTrigger: "tooltipTrigger", tooltipPosition: "tooltipPosition", tooltipType: "tooltipType" }, outputs: { btnAction: "btnAction", dropDownClicked: "dropDownClicked" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }, { propertyName: "dropdownToggle", first: true, predicate: ["dropdownToggle"], descendants: true }], ngImport: i0, template: "<!-- Wrapper pour le tooltip -->\r\n@if (withTooltip) {\r\n  <div class=\"d-inline-block position-relative\" (clickOutside)=\"onTooltipClickOutside()\" ctwClickOutside>\r\n\r\n    <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n\r\n    <!-- Tooltip/Popover -->\r\n    @if (isTooltipOpened) {\r\n    <div role=\"tooltip\" [id]=\"'ctw-tooltip-' + tooltipRandomId\" [ngClass]=\"tooltipType + ' fade show ' + tooltipType + '-' + tooltipPosition\">\r\n      <div class=\"arrow\"></div>\r\n        @if (tooltipTitle) {\r\n          <div [ngClass]=\"(tooltipType === typeTooltipEnum.popover ? 'popover' : 'tooltip') + '-header'\"\r\n            [innerHTML]=\"tooltipTitle\"></div>\r\n        }\r\n        <div [ngClass]=\"tooltipType === typeTooltipEnum.tooltip ? 'tooltip-inner' : 'popover-body'\"\r\n          [innerHTML]=\"tooltipText\"></div>\r\n    </div>\r\n    }\r\n  </div>\r\n}\r\n@else {\r\n  <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n}\r\n\r\n<!-- Template du bouton (code existant envelopp\u00E9) -->\r\n<ng-template #buttonTemplate>\r\n  @if (!isDropdown) {\r\n    <button type=\"button\" class=\"btn\" [class]=\"'btn-' + type + ' ' + cssClass\" [ngClass]=\"getButtonClasses()\"\r\n      [disabled]=\"isDisabled\" (click)=\"onBtnAction()\" [attr.data-test-ctw]=\"dataTest\"\r\n      [attr.aria-describedby]=\"withTooltip && isTooltipOpened ? 'ctw-tooltip-' + tooltipRandomId : null\"\r\n      (mouseenter)=\"withTooltip && tooltipTrigger === 'hover' ? showTooltip() : null\"\r\n      (mouseleave)=\"withTooltip && tooltipTrigger === 'hover' ? hideTooltip() : null\"\r\n      (click)=\"withTooltip && tooltipTrigger === 'click' ? showTooltip() : null\">\r\n\r\n      @if (isLoading) {\r\n      <span class=\"spinner-border spinner-border-sm\" aria-hidden=\"true\"></span>\r\n      <span class=\"visually-hidden\" role=\"status\">{{ '_COMMON._HTTP.TXT_LOADING' | translate }}</span>\r\n      }\r\n\r\n      <ng-container *ngTemplateOutlet=\"buttonContent\"></ng-container>\r\n    </button>\r\n  }\r\n  @else {\r\n    <div (clickOutside)=\"onClickOutside()\" ctwClickOutside #dropdown class=\"d-inline-block\">\r\n      <button class=\"btn\" [class]=\"'btn-' + type + ' '\" type=\"button\"\r\n        [ngClass]=\"getButtonClasses()\"\r\n        [disabled]=\"isDisabled\" [id]=\"id\" aria-expanded=\"false\" (click)=\"toggleDropdown()\" #dropdownToggle\r\n        [attr.data-test-ctw]=\"dataTest\"\r\n        [attr.aria-describedby]=\"withTooltip && isTooltipOpened ? 'ctw-tooltip-' + tooltipRandomId : null\"\r\n        (mouseenter)=\"withTooltip && tooltipTrigger === 'hover' ? showTooltip() : null\"\r\n        (mouseleave)=\"withTooltip && tooltipTrigger === 'hover' ? hideTooltip() : null\">\r\n\r\n        <ng-container *ngTemplateOutlet=\"buttonContent\"></ng-container>\r\n      </button>\r\n\r\n      <div [attr.aria-labelledby]=\"id\" class=\"dropdown-menu\" [ngClass]=\"placementCss\" #dropdownMenu>\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  }\r\n</ng-template>\r\n\r\n<!-- Template existant du contenu du bouton -->\r\n<ng-template #buttonContent>\r\n  @if (withIcon && iconPosition === buttonPositionEnum.left) {\r\n    <ng-container *ngTemplateOutlet=\"iconContent\"></ng-container>\r\n  }\r\n\r\n  @if(withOnlyIcon) {\r\n    <span class=\"visually-hidden\">{{label | translate }}</span>\r\n  }\r\n  @else {\r\n    {{ label | translate }}\r\n  }\r\n\r\n  @if (withIcon && iconPosition === buttonPositionEnum.right) {\r\n    <ng-container *ngTemplateOutlet=\"iconContent\"></ng-container>\r\n  }\r\n</ng-template>\r\n\r\n<ng-template #iconContent>\r\n    @if(withOnlyIcon) {\r\n      @switch(iconSize) {\r\n        @case(buttonIconSizeEnum.xsmall) {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['xs']\"></cw-icon>\r\n        }\r\n        @case(buttonIconSizeEnum.small) {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['sm']\"></cw-icon>\r\n        }\r\n        @default {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['md']\"></cw-icon>\r\n        }\r\n      }\r\n    }\r\n    @else {\r\n      <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['md']\"></cw-icon>\r\n    }\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-button', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule,
+                        IconComponent,
+                        ClickOutsideDirective
+                    ], template: "<!-- Wrapper pour le tooltip -->\r\n@if (withTooltip) {\r\n  <div class=\"d-inline-block position-relative\" (clickOutside)=\"onTooltipClickOutside()\" ctwClickOutside>\r\n\r\n    <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n\r\n    <!-- Tooltip/Popover -->\r\n    @if (isTooltipOpened) {\r\n    <div role=\"tooltip\" [id]=\"'ctw-tooltip-' + tooltipRandomId\" [ngClass]=\"tooltipType + ' fade show ' + tooltipType + '-' + tooltipPosition\">\r\n      <div class=\"arrow\"></div>\r\n        @if (tooltipTitle) {\r\n          <div [ngClass]=\"(tooltipType === typeTooltipEnum.popover ? 'popover' : 'tooltip') + '-header'\"\r\n            [innerHTML]=\"tooltipTitle\"></div>\r\n        }\r\n        <div [ngClass]=\"tooltipType === typeTooltipEnum.tooltip ? 'tooltip-inner' : 'popover-body'\"\r\n          [innerHTML]=\"tooltipText\"></div>\r\n    </div>\r\n    }\r\n  </div>\r\n}\r\n@else {\r\n  <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n}\r\n\r\n<!-- Template du bouton (code existant envelopp\u00E9) -->\r\n<ng-template #buttonTemplate>\r\n  @if (!isDropdown) {\r\n    <button type=\"button\" class=\"btn\" [class]=\"'btn-' + type + ' ' + cssClass\" [ngClass]=\"getButtonClasses()\"\r\n      [disabled]=\"isDisabled\" (click)=\"onBtnAction()\" [attr.data-test-ctw]=\"dataTest\"\r\n      [attr.aria-describedby]=\"withTooltip && isTooltipOpened ? 'ctw-tooltip-' + tooltipRandomId : null\"\r\n      (mouseenter)=\"withTooltip && tooltipTrigger === 'hover' ? showTooltip() : null\"\r\n      (mouseleave)=\"withTooltip && tooltipTrigger === 'hover' ? hideTooltip() : null\"\r\n      (click)=\"withTooltip && tooltipTrigger === 'click' ? showTooltip() : null\">\r\n\r\n      @if (isLoading) {\r\n      <span class=\"spinner-border spinner-border-sm\" aria-hidden=\"true\"></span>\r\n      <span class=\"visually-hidden\" role=\"status\">{{ '_COMMON._HTTP.TXT_LOADING' | translate }}</span>\r\n      }\r\n\r\n      <ng-container *ngTemplateOutlet=\"buttonContent\"></ng-container>\r\n    </button>\r\n  }\r\n  @else {\r\n    <div (clickOutside)=\"onClickOutside()\" ctwClickOutside #dropdown class=\"d-inline-block\">\r\n      <button class=\"btn\" [class]=\"'btn-' + type + ' '\" type=\"button\"\r\n        [ngClass]=\"getButtonClasses()\"\r\n        [disabled]=\"isDisabled\" [id]=\"id\" aria-expanded=\"false\" (click)=\"toggleDropdown()\" #dropdownToggle\r\n        [attr.data-test-ctw]=\"dataTest\"\r\n        [attr.aria-describedby]=\"withTooltip && isTooltipOpened ? 'ctw-tooltip-' + tooltipRandomId : null\"\r\n        (mouseenter)=\"withTooltip && tooltipTrigger === 'hover' ? showTooltip() : null\"\r\n        (mouseleave)=\"withTooltip && tooltipTrigger === 'hover' ? hideTooltip() : null\">\r\n\r\n        <ng-container *ngTemplateOutlet=\"buttonContent\"></ng-container>\r\n      </button>\r\n\r\n      <div [attr.aria-labelledby]=\"id\" class=\"dropdown-menu\" [ngClass]=\"placementCss\" #dropdownMenu>\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  }\r\n</ng-template>\r\n\r\n<!-- Template existant du contenu du bouton -->\r\n<ng-template #buttonContent>\r\n  @if (withIcon && iconPosition === buttonPositionEnum.left) {\r\n    <ng-container *ngTemplateOutlet=\"iconContent\"></ng-container>\r\n  }\r\n\r\n  @if(withOnlyIcon) {\r\n    <span class=\"visually-hidden\">{{label | translate }}</span>\r\n  }\r\n  @else {\r\n    {{ label | translate }}\r\n  }\r\n\r\n  @if (withIcon && iconPosition === buttonPositionEnum.right) {\r\n    <ng-container *ngTemplateOutlet=\"iconContent\"></ng-container>\r\n  }\r\n</ng-template>\r\n\r\n<ng-template #iconContent>\r\n    @if(withOnlyIcon) {\r\n      @switch(iconSize) {\r\n        @case(buttonIconSizeEnum.xsmall) {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['xs']\"></cw-icon>\r\n        }\r\n        @case(buttonIconSizeEnum.small) {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['sm']\"></cw-icon>\r\n        }\r\n        @default {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['md']\"></cw-icon>\r\n        }\r\n      }\r\n    }\r\n    @else {\r\n      <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSizeEnum['md']\"></cw-icon>\r\n    }\r\n</ng-template>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { type: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], isDropdown: [{
+                type: Input
+            }], withIcon: [{
+                type: Input
+            }], withOnlyIcon: [{
+                type: Input
+            }], iconSize: [{
+                type: Input
+            }], iconPosition: [{
+                type: Input
+            }], dropdownPosition: [{
+                type: Input
+            }], isMinWidth: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], withSpinner: [{
+                type: Input
+            }], cssClass: [{
+                type: Input
+            }], dataTest: [{
+                type: Input
+            }], withTooltip: [{
+                type: Input
+            }], tooltipText: [{
+                type: Input
+            }], tooltipTitle: [{
+                type: Input
+            }], tooltipTrigger: [{
+                type: Input
+            }], tooltipPosition: [{
+                type: Input
+            }], tooltipType: [{
+                type: Input
+            }], btnAction: [{
+                type: Output
+            }], dropDownClicked: [{
+                type: Output
+            }], dropdown: [{
+                type: ViewChild,
+                args: ['dropdown']
+            }], dropdownMenu: [{
+                type: ViewChild,
+                args: ['dropdownMenu']
+            }], dropdownToggle: [{
+                type: ViewChild,
+                args: ['dropdownToggle']
+            }] } });
+
+class DropdownComponent {
+    constructor() {
+        this.title = 'Dropdown';
+        this.icon = 'cw-nav-small-menu';
+        this.btnCustom = false;
+        this.btnCssClass = 'btn-secondary';
+        this.menuClass = '';
+        this.placement = 'bottom-start';
+        this.autoClose = true;
+        this.opened = output();
+        this.closed = output();
+        this.isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    }
+    get dropdownId() {
+        return this.id || `dropdown-${Math.random().toString(36).substring(2, 11)}`;
+    }
+    get placementCss() {
+        return this.placement;
+    }
+    ngAfterViewInit() {
+        // Fermer au clic sur un item du menu
+        if (this.autoClose && this.dropdownMenu) {
+            this.dropdownMenu.nativeElement.addEventListener('click', (event) => {
+                const target = event.target;
+                if (target.classList.contains('dropdown-item')) {
+                    this.closeDropdown();
+                }
+            });
+        }
+    }
+    toggleDropdown() {
+        if (this.isOpen()) {
+            this.closeDropdown();
+        }
+        else {
+            this.openDropdown();
+        }
+    }
+    openDropdown() {
+        this.isOpen.set(true);
+        this.opened.emit();
+    }
+    closeDropdown() {
+        this.isOpen.set(false);
+        this.closed.emit();
+    }
+    onClickOutside() {
+        if (this.isOpen()) {
+            this.closeDropdown();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DropdownComponent, isStandalone: true, selector: "cw-dropdown", inputs: { id: "id", title: "title", icon: "icon", btnCustom: "btnCustom", btnCssClass: "btnCssClass", menuClass: "menuClass", placement: "placement", autoClose: "autoClose" }, outputs: { opened: "opened", closed: "closed" }, viewQueries: [{ propertyName: "dropdownElement", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }, { propertyName: "dropdownToggle", first: true, predicate: ["dropdownToggle"], descendants: true }], ngImport: i0, template: "<div class=\"dropdown\" [class.show]=\"isOpen()\" (clickOutside)=\"onClickOutside()\" clickOutside #dropdown>\r\n\r\n  <button type=\"button\" class=\"dropdown-toggle btn\" [id]=\"dropdownId\" [attr.aria-expanded]=\"isOpen()\"\r\n    [attr.aria-haspopup]=\"true\" (click)=\"toggleDropdown()\" [ngClass]=\"btnCssClass\" #dropdownToggle>\r\n\r\n    <!-- Custom button content -->\r\n    <ng-content select=\"[button]\"></ng-content>\r\n\r\n    <!-- Classic button with icon -->\r\n    @if (!btnCustom) {\r\n      <cw-icon label=\"Menu\"></cw-icon>\r\n    }\r\n  </button>\r\n\r\n  <div [attr.aria-labelledby]=\"dropdownId\" class=\"dropdown-menu\" [class.show]=\"isOpen()\"\r\n    [ngClass]=\"placementCss + ' ' + menuClass\" #dropdownMenu>\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-dropdown', standalone: true, imports: [
+                        CommonModule,
+                        ClickOutsideDirective,
+                        IconComponent
+                    ], template: "<div class=\"dropdown\" [class.show]=\"isOpen()\" (clickOutside)=\"onClickOutside()\" clickOutside #dropdown>\r\n\r\n  <button type=\"button\" class=\"dropdown-toggle btn\" [id]=\"dropdownId\" [attr.aria-expanded]=\"isOpen()\"\r\n    [attr.aria-haspopup]=\"true\" (click)=\"toggleDropdown()\" [ngClass]=\"btnCssClass\" #dropdownToggle>\r\n\r\n    <!-- Custom button content -->\r\n    <ng-content select=\"[button]\"></ng-content>\r\n\r\n    <!-- Classic button with icon -->\r\n    @if (!btnCustom) {\r\n      <cw-icon label=\"Menu\"></cw-icon>\r\n    }\r\n  </button>\r\n\r\n  <div [attr.aria-labelledby]=\"dropdownId\" class=\"dropdown-menu\" [class.show]=\"isOpen()\"\r\n    [ngClass]=\"placementCss + ' ' + menuClass\" #dropdownMenu>\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n" }]
+        }], propDecorators: { id: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], btnCustom: [{
+                type: Input
+            }], btnCssClass: [{
+                type: Input
+            }], menuClass: [{
+                type: Input
+            }], placement: [{
+                type: Input
+            }], autoClose: [{
+                type: Input
+            }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], dropdownElement: [{
+                type: ViewChild,
+                args: ['dropdown']
+            }], dropdownMenu: [{
+                type: ViewChild,
+                args: ['dropdownMenu']
+            }], dropdownToggle: [{
+                type: ViewChild,
+                args: ['dropdownToggle']
+            }] } });
+
+class ShowHidePasswordDirective {
+    constructor(el, renderer, translateService) {
+        this.el = el;
+        this.renderer = renderer;
+        this.translateService = translateService;
+        this.isShown = false;
+    }
+    ngOnInit() {
+        this.setup();
+    }
+    setup() {
+        const div = this.renderer.createElement('div');
+        this.renderer.insertBefore(this.el.nativeElement.parentNode, div, this.el.nativeElement);
+        this.renderer.appendChild(div, this.el.nativeElement);
+        this.renderer.addClass(div, 'see-password-container');
+        const button = this.renderer.createElement('button');
+        this.renderer.appendChild(this.el.nativeElement.parentNode, button);
+        this.renderer.addClass(button, 'btn');
+        this.renderer.setAttribute(button, 'type', 'button');
+        this.renderer.addClass(button, 'optyweb');
+        this.renderer.addClass(button, 'cw-hide-map');
+        this.renderer.addClass(button, 'py-2');
+        this.renderer.addClass(button, 'see-password');
+        const srOnly = this.renderer.createElement('span');
+        this.renderer.appendChild(button, srOnly);
+        this.renderer.addClass(srOnly, 'visually-hidden');
+        this.renderer.setProperty(srOnly, 'innerHTML', this.translateService.instant('_COMMON._FORM._SHOW_HIDE_PWD.SHOW'));
+        this.renderer.listen(button, 'click', (event) => {
+            this.isShown = !this.isShown;
+            if (this.isShown) {
+                this.el.nativeElement.setAttribute('type', 'text');
+                this.renderer.removeClass(button, 'cw-hide-map');
+                this.renderer.addClass(button, 'cw-show-map');
+                this.renderer.setProperty(srOnly, 'innerHTML', this.translateService.instant('_COMMON._FORM._SHOW_HIDE_PWD.HIDE'));
+            }
+            else {
+                this.el.nativeElement.setAttribute('type', 'password');
+                this.renderer.addClass(button, 'cw-hide-map');
+                this.renderer.removeClass(button, 'cw-show-map');
+                this.renderer.setProperty(srOnly, 'innerHTML', this.translateService.instant('_COMMON._FORM._SHOW_HIDE_PWD.SHOW'));
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ShowHidePasswordDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: ShowHidePasswordDirective, isStandalone: true, selector: "[showHidePassword]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ShowHidePasswordDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[showHidePassword]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i2.TranslateService }] });
+
+var FormFieldTypeEnum;
+(function (FormFieldTypeEnum) {
+    FormFieldTypeEnum["text"] = "text";
+    FormFieldTypeEnum["date"] = "date";
+    FormFieldTypeEnum["time"] = "time";
+    FormFieldTypeEnum["dateTime"] = "datetime-local";
+    FormFieldTypeEnum["textarea"] = "textarea";
+    FormFieldTypeEnum["select"] = "select";
+    FormFieldTypeEnum["range"] = "range";
+    FormFieldTypeEnum["radio"] = "radio";
+    FormFieldTypeEnum["radioInline"] = "radioInline";
+    FormFieldTypeEnum["radioButton"] = "radioButton";
+    FormFieldTypeEnum["checkbox"] = "checkbox";
+    FormFieldTypeEnum["checkboxInline"] = "checkboxInline";
+    FormFieldTypeEnum["checkboxButton"] = "checkboxButton";
+    FormFieldTypeEnum["switch"] = "switch";
+    FormFieldTypeEnum["switchSmall"] = "switchSmall";
+    FormFieldTypeEnum["ngSelect"] = "ngSelect";
+    FormFieldTypeEnum["ngSelectMultiple"] = "ngSelectMultiple";
+    FormFieldTypeEnum["number"] = "number";
+    FormFieldTypeEnum["color"] = "color";
+    FormFieldTypeEnum["file"] = "file";
+    FormFieldTypeEnum["password"] = "password";
+    FormFieldTypeEnum["email"] = "email";
+    FormFieldTypeEnum["slider"] = "slider";
+    FormFieldTypeEnum["dateToDate"] = "dateToDate";
+    FormFieldTypeEnum["datePlusOne"] = "datePlusOne";
+    FormFieldTypeEnum["datePlusTwo"] = "datePlusTwo";
+    FormFieldTypeEnum["datePlusSeven"] = "datePlusSeven";
+    FormFieldTypeEnum["dateComplexe"] = "dateComplexe";
+    FormFieldTypeEnum["dateTimeToDateTime"] = "dateTimeToDateTime";
+    FormFieldTypeEnum["timeToTime"] = "timeToTime";
+})(FormFieldTypeEnum || (FormFieldTypeEnum = {}));
+
+function rangeValidator(group, type) {
+    const startControl = group.get('start');
+    const endControl = group.get('end');
+    const start = startControl?.value;
+    const end = endControl?.value;
+    if (!start || !end)
+        return null;
+    let startValue;
+    let endValue;
+    switch (type) {
+        case 'time':
+            startValue = parseTime(start);
+            endValue = parseTime(end);
+            break;
+        case 'datetime':
+            startValue = new Date(start).getTime();
+            endValue = new Date(end).getTime();
+            break;
+        default: // date
+            startValue = new Date(start).setHours(0, 0, 0, 0);
+            endValue = new Date(end).setHours(0, 0, 0, 0);
+    }
+    if (startValue > endValue) {
+        // Marquer les enfants comme invalid
+        startControl?.setErrors({ ...startControl.errors, rangeInvalid: true });
+        endControl?.setErrors({ ...endControl.errors, rangeInvalid: true });
+        return { rangeInvalid: true };
+    }
+    else {
+        // Supprimer l’erreur rangeInvalid si présente
+        if (startControl?.errors?.['rangeInvalid']) {
+            const { rangeInvalid, ...rest } = startControl.errors;
+            startControl.setErrors(Object.keys(rest).length ? rest : null);
+        }
+        if (endControl?.errors?.['rangeInvalid']) {
+            const { rangeInvalid, ...rest } = endControl.errors;
+            endControl.setErrors(Object.keys(rest).length ? rest : null);
+        }
+    }
+    return null;
+}
+function parseTime(time) {
+    const [h, m] = time.split(':').map(Number);
+    return h * 60 + m;
+}
+class FormFieldComponent {
+    get hostClasses() {
+        return 'position-relative';
+    }
+    constructor() {
+        this.displayLabel = true;
+        this.options = [];
+        this.isRequired = false;
+        this.isInAddon = false;
+        this.isReadonly = false;
+        this.isDisabled = false;
+        this.refreshEvent = new EventEmitter();
+        this.textChanged = new EventEmitter();
+        this.typeField = FormFieldTypeEnum;
+    }
+    get isRange() {
+        if (!this.control)
+            return false;
+        return this.control instanceof FormGroup &&
+            'start' in this.control.controls &&
+            'end' in this.control.controls;
+    }
+    get formControl() {
+        return this.control;
+    }
+    get controlOrGroup() {
+        return this.control ?? this.formGroup?.get(this.name);
+    }
+    ngOnInit() {
+        if (this.formGroup && this.name) {
+            const group = this.formGroup.get(this.name);
+            if (group instanceof FormGroup) {
+                switch (this.type) {
+                    case this.typeField.dateToDate:
+                        group.setValidators(g => rangeValidator(g, 'date'));
+                        break;
+                    case this.typeField.timeToTime:
+                        group.setValidators(g => rangeValidator(g, 'time'));
+                        break;
+                    case this.typeField.dateTimeToDateTime:
+                        group.setValidators(g => rangeValidator(g, 'datetime'));
+                        break;
+                }
+                group.updateValueAndValidity();
+            }
+        }
+    }
+    onCheckboxChange(event) {
+        const checkbox = event.target;
+        const valueArray = this.control.value || [];
+        if (checkbox.checked) {
+            this.control.setValue([...valueArray, checkbox.value]);
+        }
+        else {
+            this.control.setValue(valueArray.filter((v) => v !== checkbox.value));
+        }
+        this.control.markAsTouched();
+    }
+    onBlur() {
+        if (this.control && !this.control.touched) {
+            this.control.markAsTouched();
+        }
+    }
+    isInInputGroup() {
+        const inInputGroup = [
+            this.typeField.text,
+            this.typeField.date,
+            this.typeField.time,
+            this.typeField.dateTime,
+            this.typeField.number,
+            this.typeField.email,
+            this.typeField.textarea,
+            this.typeField.password,
+        ].includes(this.type);
+        return inInputGroup;
+    }
+    getControl(path) {
+        if (!this.isRange)
+            return null;
+        const group = this.control;
+        return group.get(path);
+    }
+    getInputType() {
+        switch (this.type) {
+            case this.typeField.dateToDate:
+                return 'date';
+            case this.typeField.timeToTime:
+                return 'time';
+            case this.typeField.dateTimeToDateTime:
+                return 'datetime-local';
+            default:
+                return 'text';
+        }
+    }
+    onClearFieldPeriod(path) {
+        const ctrl = this.getControl(path);
+        if (ctrl) {
+            ctrl.setValue(null);
+            ctrl.markAsPristine();
+            ctrl.markAsUntouched();
+        }
+    }
+    onClearField(control) {
+        control?.setValue(null);
+        control?.markAsPristine();
+        control?.markAsUntouched();
+    }
+    onDateAddDay(direction) {
+        const current = this.getDateValue();
+        if (current) {
+            const delta = direction === 'prev' ? -1 : 1;
+            current.setDate(current.getDate() + delta);
+            this.formControl.setValue(this.formatDate(current));
+        }
+    }
+    onTodayAddDay(days) {
+        const today = new Date();
+        today.setDate(today.getDate() + days);
+        this.formControl.setValue(this.formatDate(today));
+    }
+    onRefresh() {
+        this.refreshEvent.emit();
+    }
+    getDateValue() {
+        const value = this.formControl.value;
+        if (!value)
+            return null;
+        const date = new Date(value);
+        return isNaN(date.getTime()) ? null : date;
+    }
+    formatDate(date) {
+        const year = date.getFullYear();
+        const month = (date.getMonth() + 1).toString().padStart(2, '0');
+        const day = date.getDate().toString().padStart(2, '0');
+        return `${year}-${month}-${day}`;
+    }
+    getRangePercent() {
+        const value = this.formControl.value || this.rangeOptions.floor;
+        const range = this.rangeOptions.ceil - this.rangeOptions.floor;
+        return ((value - this.rangeOptions.floor) / range) * 100;
+    }
+    onRangeStep(direction) {
+        const step = this.rangeOptions.step || 1;
+        const currentValue = this.formControl.value || this.rangeOptions.floor;
+        if (direction === 'increase' && currentValue < this.rangeOptions.ceil) {
+            this.formControl.setValue(Math.min(currentValue + step, this.rangeOptions.ceil));
+        }
+        else if (direction === 'decrease' && currentValue > this.rangeOptions.floor) {
+            this.formControl.setValue(Math.max(currentValue - step, this.rangeOptions.floor));
+        }
+        this.formControl.markAsTouched();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FormFieldComponent, isStandalone: true, selector: "cw-form-field", inputs: { control: "control", formGroup: "formGroup", type: "type", label: "label", displayLabel: "displayLabel", name: "name", placeholder: "placeholder", options: "options", rangeOptions: "rangeOptions", isRequired: "isRequired", help: "help", tooltip: "tooltip", addonLeft: "addonLeft", addonRight: "addonRight", isInAddon: "isInAddon", isReadonly: "isReadonly", isDisabled: "isDisabled", sliderValue: "sliderValue", sliderOptions: "sliderOptions", cssClass: "cssClass" }, outputs: { refreshEvent: "refreshEvent", textChanged: "textChanged" }, host: { properties: { "class": "this.hostClasses" } }, queries: [{ propertyName: "optionTemplate", first: true, predicate: ["ngOptionTpl"], descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: ["ngLabelTpl"], descendants: true, read: TemplateRef }], ngImport: i0, template: "@if (!isInAddon) {\r\n  @if (\r\n  type !== typeField.checkbox &&\r\n  type !== typeField.radio &&\r\n  type !== typeField.checkboxButton &&\r\n  type !== typeField.radioButton &&\r\n  type !== typeField.checkboxInline &&\r\n  type !== typeField.radioInline &&\r\n  type !== typeField.switch &&\r\n  type !== typeField.range &&\r\n  type !== typeField.switchSmall\r\n\r\n  ) {\r\n    <label [for]=\"name\" class=\"form-label\" [class.visually-hidden]=\"!displayLabel\">\r\n      {{ label }}\r\n\r\n      @if (isRequired) {\r\n        <span class=\"text-danger\">*</span>\r\n      }\r\n\r\n      @if (tooltip) {\r\n        <button type=\"button\" class=\"btn btn-link btn-popover\" placement=\"bottom\" [ngbPopover]=\"popContent\" container=\"body\"\r\n          triggers=\"mouseenter:mouseleave\">\r\n          <span class=\"btn-popover-icon bo-icons bo-help\"></span>\r\n        </button>\r\n        <ng-template #popContent>\r\n          <div [innerHTML]=\"tooltip\"></div>\r\n        </ng-template>\r\n      }\r\n    </label>\r\n    }\r\n\r\n    @if (addonLeft || addonRight) {\r\n      <div class=\"input-group\">\r\n        @if(addonLeft) {\r\n          <ng-container [ngTemplateOutlet]=\"addonLeft\"></ng-container>\r\n        }\r\n        <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n        @if(addonRight) {\r\n          <ng-container [ngTemplateOutlet]=\"addonRight\"></ng-container>\r\n        }\r\n      </div>\r\n    }\r\n    @else {\r\n      @if ( isInInputGroup() ) {\r\n        <div class=\"input-group\">\r\n          <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n        </div>\r\n      }\r\n      @else {\r\n        <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n      }\r\n    }\r\n\r\n    <!-- Error message -->\r\n    @if (controlOrGroup?.invalid && controlOrGroup?.touched) {\r\n      <div class=\"invalid-feedback d-block\" [id]=\"'error-' + name\">\r\n        @if ((controlOrGroup?.errors?.['required']) || (getControl('start')?.errors?.['required'] || getControl('end')?.errors?.['required'])) {\r\n          <span [innerHtml]=\"'_COMMON._FORM.ERROR_IS_MANDATORY' | translate: {label: label}\"></span>\r\n        }\r\n        @if(controlOrGroup?.errors?.['rangeInvalid']) {\r\n          <span>{{'_COMMON._DATES.ERROR_START_END_PERIOD' | translate}}</span>\r\n        }\r\n      </div>\r\n    }\r\n\r\n    @if (help) {\r\n      <small [id]=\"name + '-help'\" class=\"form-text text-muted\">{{help}}</small>\r\n    }\r\n}\r\n@else {\r\n  <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n}\r\n\r\n<ng-template #field>\r\n  <!-- Text -->\r\n  @if ([typeField.text, typeField.date, typeField.time, typeField.dateTime, typeField.number, typeField.file,\r\n  typeField.email,\r\n  typeField.color].includes(type)) {\r\n  <input [type]=\"type\" class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n    [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n    [attr.placeholder]=\"placeholder ? placeholder : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n    [attr.readonly]=\"isReadonly ? 'readonly' : null\" [disabled]=\"isDisabled\" [attr.aria-required]=\"isRequired\"\r\n    [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n    [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" />\r\n  }\r\n\r\n  @if (type === typeField.password) {\r\n  <input showHidePassword [type]=\"type\" class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n    [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n    [attr.required]=\"isRequired ? 'required' : null\" [attr.readonly]=\"isReadonly ? 'readonly' : null\"\r\n    [attr.disabled]=\"isDisabled ? 'disabled' : null\" [attr.aria-required]=\"isRequired\"\r\n    [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n    [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" />\r\n  }\r\n\r\n  <!-- Textarea -->\r\n  @if (type === typeField.textarea) {\r\n    <textarea class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n      [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n      [attr.placeholder]=\"placeholder ? placeholder : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n      [attr.readonly]=\"isReadonly ? 'readonly' : null\" [attr.disabled]=\"isDisabled ? 'disabled' : null\"\r\n      [attr.aria-required]=\"isRequired\" [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n      [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\"></textarea>\r\n  }\r\n\r\n  <!-- Select -->\r\n  @if (type === typeField.select) {\r\n    <ng-select [formControl]=\"formControl\" [items]=\"options\" bindLabel=\"label\" [labelForId]=\"name\" bindValue=\"value\"\r\n      [ngClass]=\"cssClass\" [searchable]=\"false\" [placeholder]=\"placeholder ? placeholder : null\" [readonly]=\"isReadonly\"\r\n      [attr.disabled]=\"isDisabled ? 'disabled' : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n      [attr.aria-required]=\"isRequired\" [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n      [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" [attr.id]=\"name\"\r\n      (blur)=\"onBlur()\">\r\n\r\n      <!-- Template pour les options -->\r\n      <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        @if (optionTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"optionTemplate; context: { item: item, index: index, searchTerm: search }\"></ng-container>\r\n        }\r\n        @else {\r\n          <div>{{ item.label }}</div>\r\n        }\r\n      </ng-template>\r\n\r\n      <!-- Template pour le label -->\r\n      <ng-template ng-label-tmp let-item=\"item\">\r\n        @if (labelTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"labelTemplate; context: { item: item }\"></ng-container>\r\n        }\r\n        @else {\r\n            {{ item.label }}\r\n        }\r\n      </ng-template>\r\n    </ng-select>\r\n  }\r\n\r\n  <!-- NgSelect -->\r\n  @if (type === typeField.ngSelect || type === typeField.ngSelectMultiple) {\r\n    <ng-select [formControl]=\"formControl\" [items]=\"options\" bindLabel=\"label\" [labelForId]=\"name\" bindValue=\"value\"\r\n      [multiple]=\"type === typeField.ngSelectMultiple\" [ngClass]=\"cssClass\"\r\n      [placeholder]=\"placeholder ? placeholder : null\" [readonly]=\"isReadonly\"\r\n      [notFoundText]=\"'_COMMON.NO_RESULT' | translate\" [attr.disabled]=\"isDisabled ? 'disabled' : null\"\r\n      [attr.required]=\"isRequired ? 'required' : null\" [attr.aria-required]=\"isRequired\"\r\n      [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n      [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" [attr.id]=\"name\"\r\n      (blur)=\"onBlur()\" (search)=\"textChanged.emit($event?.term)\">\r\n\r\n      <!-- Template pour les options -->\r\n      <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        @if (optionTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"optionTemplate; context: { item: item, index: index, searchTerm: search }\"></ng-container>\r\n        }\r\n        @else {\r\n          <div>{{ item.label }}</div>\r\n        }\r\n      </ng-template>\r\n\r\n      <!-- Template pour le label -->\r\n      <ng-template ng-label-tmp let-item=\"item\">\r\n        @if (labelTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"labelTemplate; context: { item: item }\"></ng-container>\r\n        }\r\n        @else {\r\n          {{ item.label }}\r\n        }\r\n      </ng-template>\r\n    </ng-select>\r\n  }\r\n\r\n  <!-- Radio -->\r\n  @if (type === typeField.radioInline || type === typeField.radio) {\r\n  <fieldset [ngClass]=\"{ 'flex-column': type === typeField.radio }\">\r\n    <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n    <ul class=\" mb-none\" [ngClass]=\"type === typeField.radioInline ? 'list-inline' : 'list-unstyled'\">\r\n      <li *ngFor=\"let opt of options\" class=\"form-check\"\r\n        [ngClass]=\"{ 'form-check-inline': type === typeField.radioInline }\">\r\n        <input type=\"radio\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" [formControl]=\"formControl\"\r\n          class=\"form-check-input\" />\r\n        <label [for]=\"name + '_' + opt.value\" class=\"form-check-label\">{{ opt.label }}</label>\r\n      </li>\r\n    </ul>\r\n  </fieldset>\r\n  }\r\n\r\n  <!-- Radio button -->\r\n  @if (type === typeField.radioButton) {\r\n  <fieldset>\r\n    <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n    <div class=\"btn-group btn-group-secondary\">\r\n      <ng-container *ngFor=\"let opt of options\">\r\n        <input type=\"radio\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" [formControl]=\"formControl\"\r\n          class=\"visually-hidden\" />\r\n        <label [for]=\"name + '_' + opt.value\" class=\"btn btn-form\">{{ opt.label }}</label>\r\n      </ng-container>\r\n    </div>\r\n  </fieldset>\r\n  }\r\n\r\n  <!-- Checkbox  Switch -->\r\n  @if (\r\n  (type === typeField.checkbox ||\r\n  type === typeField.switch ||\r\n  type === typeField.switchSmall)\r\n  && options.length === 0\r\n  ) {\r\n  <div class=\"form-check form-switch\" [ngClass]=\"{'form-switch-small': type === typeField.switchSmall}\">\r\n    <input type=\"checkbox\" [id]=\"name\" [formControl]=\"formControl\" class=\"form-check-input\" />\r\n    <label [for]=\"name\" class=\"form-check-label\">{{ label }}</label>\r\n  </div>\r\n  }\r\n\r\n  <!-- Checkbox -->\r\n  @if ((type === typeField.checkboxInline || type === typeField.checkbox) && options.length > 0) {\r\n    <fieldset [ngClass]=\"{ 'flex-column': type === typeField.checkbox }\">\r\n      <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n      <ul class=\"mb-none\" [ngClass]=\"type === typeField.checkboxInline ? 'list-inline' : 'list-unstyled'\">\r\n        <li *ngFor=\"let opt of options\" class=\"form-check\"\r\n          [ngClass]=\"{ 'form-check-inline': type === typeField.checkboxInline }\">\r\n          <input type=\"checkbox\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" (change)=\"onCheckboxChange($event)\"\r\n            [checked]=\"control.value?.includes(opt.value)\" class=\"form-check-input\" />\r\n          <label [for]=\"name + '_' + opt.value\" class=\"form-check-label\">{{ opt.label }}</label>\r\n        </li>\r\n      </ul>\r\n    </fieldset>\r\n  }\r\n\r\n  <!-- Checkbox button -->\r\n  @if (type === typeField.checkboxButton) {\r\n    <fieldset>\r\n      <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n      <div class=\"btn-group btn-group-secondary\">\r\n        <ng-container *ngFor=\"let opt of options\">\r\n          <input type=\"checkbox\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" (change)=\"onCheckboxChange($event)\"\r\n            [checked]=\"control.value?.includes(opt.value)\" class=\"visually-hidden\" />\r\n          <label [for]=\"name + '_' + opt.value\" class=\"btn btn-form\">{{ opt.label }}</label>\r\n        </ng-container>\r\n      </div>\r\n    </fieldset>\r\n  }\r\n\r\n  <!-- Period - DateToDate / TimeToTime / DateTimeToDateTime -->\r\n  @if ([typeField.dateToDate, typeField.timeToTime, typeField.dateTimeToDateTime].includes(type) && isRange) {\r\n\r\n    <div class=\"input-group\">\r\n\r\n      <input [type]=\"getInputType()\" class=\"form-control\" [id]=\"name + '_start'\" [formControl]=\"getControl('start')\"\r\n        [attr.placeholder]=\"type === typeField.timeToTime ? ('_COMMON._DATES.FROM' | translate) : ('_COMMON._DATES.FROM_TO_1' | translate)\"\r\n        [ngClass]=\"[(cssClass || ''), getControl('start')?.value ? 'has-value' : '']\"\r\n        [attr.required]=\"isRequired ? 'required' : null\" [attr.readonly]=\"isReadonly ? 'readonly' : null\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\" [attr.aria-required]=\"isRequired\"\r\n        [attr.aria-invalid]=\"getControl('start')?.invalid && getControl('start')?.touched\"\r\n        [attr.aria-describedby]=\"getControl('start')?.invalid && getControl('start')?.touched ? 'error-' + name : null\" />\r\n\r\n      @if(getControl('start')?.value) {\r\n        <button type=\"button\" class=\"btn btn-secondary btn-clear-field\"\r\n          (click)=\"onClearFieldPeriod('start')\">\r\n          &times;\r\n        </button>\r\n      }\r\n\r\n      <input [type]=\"getInputType()\" class=\"form-control\" [id]=\"name + '_end'\" [formControl]=\"getControl('end')\"\r\n        [attr.placeholder]=\"type === typeField.timeToTime ? ('_COMMON._DATES.TO' | translate) : ('_COMMON._DATES.FROM_TO_2' | translate)\"\r\n        [ngClass]=\"[(cssClass || ''), getControl('end')?.value ? 'has-value' : '']\"\r\n        [attr.required]=\"isRequired ? 'required' : null\" [attr.readonly]=\"isReadonly ? 'readonly' : null\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\"\r\n        [attr.aria-invalid]=\"getControl('end')?.invalid && getControl('end')?.touched\"\r\n        [attr.aria-describedby]=\"getControl('end')?.invalid && getControl('end')?.touched ? 'error-' + name : null\" />\r\n\r\n      <button *ngIf=\"getControl('end')?.value\" type=\"button\" class=\"btn btn-secondary btn-clear-field\"\r\n        (click)=\"onClearFieldPeriod('end')\">\r\n        &times;\r\n      </button>\r\n    </div>\r\n  }\r\n\r\n  @if ([typeField.datePlusOne, typeField.datePlusTwo, typeField.datePlusSeven, typeField.dateComplexe].includes(type)) {\r\n    <div class=\"input-group\">\r\n\r\n      @if (type === typeField.dateComplexe) {\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onDateAddDay('prev')\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          <cw-icon font=\"optyweb\" icon=\"cw-nav-next-left\" [label]=\"'Jour pr\u00E9c\u00E9dent'\"></cw-icon>\r\n        </button>\r\n      }\r\n\r\n      <input type=\"date\" class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n        [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n        [attr.placeholder]=\"placeholder ? placeholder : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n        [attr.readonly]=\"isReadonly ? 'readonly' : null\" [disabled]=\"isDisabled\" [attr.aria-required]=\"isRequired\"\r\n        [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n        [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" />\r\n      <button *ngIf=\"formControl?.value\" class=\"btn btn-secondary btn-clear-field\" type=\"button\"\r\n        (click)=\"onClearField(formControl)\">&times;</button>\r\n\r\n      @if (type === typeField.dateComplexe) {\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onDateAddDay('next')\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          <cw-icon font=\"optyweb\" icon=\"cw-nav-next-right\" [label]=\"'Jour suivant'\"></cw-icon>\r\n        </button>\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onRefresh()\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          <cw-icon font=\"optyweb\" icon=\"cw-toolbar-reload\" [label]=\"'Rafra\u00EEchir'\"></cw-icon>\r\n        </button>\r\n      }\r\n\r\n      <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(0)\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n        J\r\n        <span class=\"visually-hidden\">Aujourd'hui</span>\r\n      </button>\r\n      <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(1)\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n        J+1\r\n        <span class=\"visually-hidden\">Demain</span>\r\n      </button>\r\n\r\n      @if (type !== typeField.datePlusOne && type !== typeField.dateComplexe) {\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(2)\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          J+2\r\n          <span class=\"visually-hidden\">Dans 2 jours</span>\r\n        </button>\r\n\r\n        @if (type !== typeField.datePlusTwo) {\r\n          <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(7)\"\r\n            [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n            J+7\r\n            <span class=\"visually-hidden\">Dans 7 jours</span>\r\n          </button>\r\n        }\r\n      }\r\n    </div>\r\n  }\r\n\r\n  @if (type === typeField.slider) {\r\n    <ngx-slider [(value)]=\"sliderValue\" [options]=\"sliderOptions\" [formControl]=\"formControl\"></ngx-slider>\r\n  }\r\n\r\n  @if (type === typeField.range) {\r\n    <div class=\"d-flex align-items-center gap-2\">\r\n      <button type=\"button\" class=\"btn slider-btn slider-btn-less\" (click)=\"onRangeStep('decrease')\"\r\n        [disabled]=\"formControl.value <= rangeOptions.floor\">\r\n        <span class=\"slider-btn-less-icon\" aria-hidden=\"true\"></span>\r\n        <span class=\"visually-hidden\">Diminuer</span>\r\n      </button>\r\n\r\n      <div class=\"slider-input flex-grow-1 position-relative\">\r\n        <label [for]=\"name\" class=\"slider-tooltip\" [style.left]=\"getRangePercent() + '%'\" aria-live=\"polite\"\r\n          aria-atomic=\"true\">\r\n          {{ label }} {{ formControl.value }}\r\n          @if (rangeOptions.unit) {\r\n            <abbr [title]=\"rangeOptions.unit\">{{ rangeOptions.unit }}</abbr>\r\n          }\r\n        </label>\r\n\r\n        <div class=\"slider-custom-bar\">\r\n          <div class=\"slider-custom-bar-selection\" [style.width]=\"getRangePercent() + '%'\">\r\n          </div>\r\n        </div>\r\n\r\n        <input type=\"range\" [id]=\"name\" [formControl]=\"formControl\" [min]=\"rangeOptions.floor\" [max]=\"rangeOptions.ceil\"\r\n          [step]=\"rangeOptions.step || 1\" class=\"form-control-range\" [attr.aria-required]=\"isRequired\"\r\n          [attr.aria-invalid]=\"control.invalid && control.touched\" [disabled]=\"isDisabled\">\r\n      </div>\r\n\r\n      <button type=\"button\" class=\"btn slider-btn slider-btn-more\" (click)=\"onRangeStep('increase')\"\r\n        [disabled]=\"formControl.value >= rangeOptions.ceil\">\r\n        <span class=\"slider-btn-more-icon optyweb cw-toolbar-add\" aria-hidden=\"true\"></span>\r\n        <span class=\"visually-hidden\">Augmenter</span>\r\n      </button>\r\n    </div>\r\n  }\r\n\r\n  @if (isInInputGroup()) {\r\n    @if(formControl?.value) {\r\n      <button class=\"btn btn-secondary btn-clear-field\" type=\"button\"\r\n      (click)=\"onClearField(formControl)\">&times;</button>\r\n    }\r\n  }\r\n\r\n</ng-template>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.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: i2$1.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i3.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i3.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "ngmodule", type: NgbDropdownModule }, { kind: "ngmodule", type: NgxSliderModule }, { kind: "component", type: i4.SliderComponent, selector: "ngx-slider", inputs: ["value", "highValue", "options", "manualRefresh", "triggerFocus", "cancelUserChange"], outputs: ["valueChange", "highValueChange", "userChangeStart", "userChange", "userChangeEnd"] }, { kind: "directive", type: NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "ngbPopover", "popoverTitle", "placement", "popperOptions", "triggers", "positionTarget", "container", "disablePopover", "popoverClass", "popoverContext", "openDelay", "closeDelay"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }, { kind: "directive", type: ShowHidePasswordDirective, selector: "[showHidePassword]" }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FormFieldComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-form-field', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        NgSelectModule,
+                        NgbDropdownModule,
+                        NgxSliderModule,
+                        NgbPopover,
+                        ShowHidePasswordDirective,
+                        IconComponent
+                    ], template: "@if (!isInAddon) {\r\n  @if (\r\n  type !== typeField.checkbox &&\r\n  type !== typeField.radio &&\r\n  type !== typeField.checkboxButton &&\r\n  type !== typeField.radioButton &&\r\n  type !== typeField.checkboxInline &&\r\n  type !== typeField.radioInline &&\r\n  type !== typeField.switch &&\r\n  type !== typeField.range &&\r\n  type !== typeField.switchSmall\r\n\r\n  ) {\r\n    <label [for]=\"name\" class=\"form-label\" [class.visually-hidden]=\"!displayLabel\">\r\n      {{ label }}\r\n\r\n      @if (isRequired) {\r\n        <span class=\"text-danger\">*</span>\r\n      }\r\n\r\n      @if (tooltip) {\r\n        <button type=\"button\" class=\"btn btn-link btn-popover\" placement=\"bottom\" [ngbPopover]=\"popContent\" container=\"body\"\r\n          triggers=\"mouseenter:mouseleave\">\r\n          <span class=\"btn-popover-icon bo-icons bo-help\"></span>\r\n        </button>\r\n        <ng-template #popContent>\r\n          <div [innerHTML]=\"tooltip\"></div>\r\n        </ng-template>\r\n      }\r\n    </label>\r\n    }\r\n\r\n    @if (addonLeft || addonRight) {\r\n      <div class=\"input-group\">\r\n        @if(addonLeft) {\r\n          <ng-container [ngTemplateOutlet]=\"addonLeft\"></ng-container>\r\n        }\r\n        <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n        @if(addonRight) {\r\n          <ng-container [ngTemplateOutlet]=\"addonRight\"></ng-container>\r\n        }\r\n      </div>\r\n    }\r\n    @else {\r\n      @if ( isInInputGroup() ) {\r\n        <div class=\"input-group\">\r\n          <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n        </div>\r\n      }\r\n      @else {\r\n        <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n      }\r\n    }\r\n\r\n    <!-- Error message -->\r\n    @if (controlOrGroup?.invalid && controlOrGroup?.touched) {\r\n      <div class=\"invalid-feedback d-block\" [id]=\"'error-' + name\">\r\n        @if ((controlOrGroup?.errors?.['required']) || (getControl('start')?.errors?.['required'] || getControl('end')?.errors?.['required'])) {\r\n          <span [innerHtml]=\"'_COMMON._FORM.ERROR_IS_MANDATORY' | translate: {label: label}\"></span>\r\n        }\r\n        @if(controlOrGroup?.errors?.['rangeInvalid']) {\r\n          <span>{{'_COMMON._DATES.ERROR_START_END_PERIOD' | translate}}</span>\r\n        }\r\n      </div>\r\n    }\r\n\r\n    @if (help) {\r\n      <small [id]=\"name + '-help'\" class=\"form-text text-muted\">{{help}}</small>\r\n    }\r\n}\r\n@else {\r\n  <ng-container [ngTemplateOutlet]=\"field\"></ng-container>\r\n}\r\n\r\n<ng-template #field>\r\n  <!-- Text -->\r\n  @if ([typeField.text, typeField.date, typeField.time, typeField.dateTime, typeField.number, typeField.file,\r\n  typeField.email,\r\n  typeField.color].includes(type)) {\r\n  <input [type]=\"type\" class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n    [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n    [attr.placeholder]=\"placeholder ? placeholder : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n    [attr.readonly]=\"isReadonly ? 'readonly' : null\" [disabled]=\"isDisabled\" [attr.aria-required]=\"isRequired\"\r\n    [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n    [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" />\r\n  }\r\n\r\n  @if (type === typeField.password) {\r\n  <input showHidePassword [type]=\"type\" class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n    [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n    [attr.required]=\"isRequired ? 'required' : null\" [attr.readonly]=\"isReadonly ? 'readonly' : null\"\r\n    [attr.disabled]=\"isDisabled ? 'disabled' : null\" [attr.aria-required]=\"isRequired\"\r\n    [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n    [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" />\r\n  }\r\n\r\n  <!-- Textarea -->\r\n  @if (type === typeField.textarea) {\r\n    <textarea class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n      [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n      [attr.placeholder]=\"placeholder ? placeholder : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n      [attr.readonly]=\"isReadonly ? 'readonly' : null\" [attr.disabled]=\"isDisabled ? 'disabled' : null\"\r\n      [attr.aria-required]=\"isRequired\" [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n      [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\"></textarea>\r\n  }\r\n\r\n  <!-- Select -->\r\n  @if (type === typeField.select) {\r\n    <ng-select [formControl]=\"formControl\" [items]=\"options\" bindLabel=\"label\" [labelForId]=\"name\" bindValue=\"value\"\r\n      [ngClass]=\"cssClass\" [searchable]=\"false\" [placeholder]=\"placeholder ? placeholder : null\" [readonly]=\"isReadonly\"\r\n      [attr.disabled]=\"isDisabled ? 'disabled' : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n      [attr.aria-required]=\"isRequired\" [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n      [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" [attr.id]=\"name\"\r\n      (blur)=\"onBlur()\">\r\n\r\n      <!-- Template pour les options -->\r\n      <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        @if (optionTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"optionTemplate; context: { item: item, index: index, searchTerm: search }\"></ng-container>\r\n        }\r\n        @else {\r\n          <div>{{ item.label }}</div>\r\n        }\r\n      </ng-template>\r\n\r\n      <!-- Template pour le label -->\r\n      <ng-template ng-label-tmp let-item=\"item\">\r\n        @if (labelTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"labelTemplate; context: { item: item }\"></ng-container>\r\n        }\r\n        @else {\r\n            {{ item.label }}\r\n        }\r\n      </ng-template>\r\n    </ng-select>\r\n  }\r\n\r\n  <!-- NgSelect -->\r\n  @if (type === typeField.ngSelect || type === typeField.ngSelectMultiple) {\r\n    <ng-select [formControl]=\"formControl\" [items]=\"options\" bindLabel=\"label\" [labelForId]=\"name\" bindValue=\"value\"\r\n      [multiple]=\"type === typeField.ngSelectMultiple\" [ngClass]=\"cssClass\"\r\n      [placeholder]=\"placeholder ? placeholder : null\" [readonly]=\"isReadonly\"\r\n      [notFoundText]=\"'_COMMON.NO_RESULT' | translate\" [attr.disabled]=\"isDisabled ? 'disabled' : null\"\r\n      [attr.required]=\"isRequired ? 'required' : null\" [attr.aria-required]=\"isRequired\"\r\n      [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n      [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" [attr.id]=\"name\"\r\n      (blur)=\"onBlur()\" (search)=\"textChanged.emit($event?.term)\">\r\n\r\n      <!-- Template pour les options -->\r\n      <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        @if (optionTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"optionTemplate; context: { item: item, index: index, searchTerm: search }\"></ng-container>\r\n        }\r\n        @else {\r\n          <div>{{ item.label }}</div>\r\n        }\r\n      </ng-template>\r\n\r\n      <!-- Template pour le label -->\r\n      <ng-template ng-label-tmp let-item=\"item\">\r\n        @if (labelTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"labelTemplate; context: { item: item }\"></ng-container>\r\n        }\r\n        @else {\r\n          {{ item.label }}\r\n        }\r\n      </ng-template>\r\n    </ng-select>\r\n  }\r\n\r\n  <!-- Radio -->\r\n  @if (type === typeField.radioInline || type === typeField.radio) {\r\n  <fieldset [ngClass]=\"{ 'flex-column': type === typeField.radio }\">\r\n    <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n    <ul class=\" mb-none\" [ngClass]=\"type === typeField.radioInline ? 'list-inline' : 'list-unstyled'\">\r\n      <li *ngFor=\"let opt of options\" class=\"form-check\"\r\n        [ngClass]=\"{ 'form-check-inline': type === typeField.radioInline }\">\r\n        <input type=\"radio\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" [formControl]=\"formControl\"\r\n          class=\"form-check-input\" />\r\n        <label [for]=\"name + '_' + opt.value\" class=\"form-check-label\">{{ opt.label }}</label>\r\n      </li>\r\n    </ul>\r\n  </fieldset>\r\n  }\r\n\r\n  <!-- Radio button -->\r\n  @if (type === typeField.radioButton) {\r\n  <fieldset>\r\n    <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n    <div class=\"btn-group btn-group-secondary\">\r\n      <ng-container *ngFor=\"let opt of options\">\r\n        <input type=\"radio\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" [formControl]=\"formControl\"\r\n          class=\"visually-hidden\" />\r\n        <label [for]=\"name + '_' + opt.value\" class=\"btn btn-form\">{{ opt.label }}</label>\r\n      </ng-container>\r\n    </div>\r\n  </fieldset>\r\n  }\r\n\r\n  <!-- Checkbox  Switch -->\r\n  @if (\r\n  (type === typeField.checkbox ||\r\n  type === typeField.switch ||\r\n  type === typeField.switchSmall)\r\n  && options.length === 0\r\n  ) {\r\n  <div class=\"form-check form-switch\" [ngClass]=\"{'form-switch-small': type === typeField.switchSmall}\">\r\n    <input type=\"checkbox\" [id]=\"name\" [formControl]=\"formControl\" class=\"form-check-input\" />\r\n    <label [for]=\"name\" class=\"form-check-label\">{{ label }}</label>\r\n  </div>\r\n  }\r\n\r\n  <!-- Checkbox -->\r\n  @if ((type === typeField.checkboxInline || type === typeField.checkbox) && options.length > 0) {\r\n    <fieldset [ngClass]=\"{ 'flex-column': type === typeField.checkbox }\">\r\n      <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n      <ul class=\"mb-none\" [ngClass]=\"type === typeField.checkboxInline ? 'list-inline' : 'list-unstyled'\">\r\n        <li *ngFor=\"let opt of options\" class=\"form-check\"\r\n          [ngClass]=\"{ 'form-check-inline': type === typeField.checkboxInline }\">\r\n          <input type=\"checkbox\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" (change)=\"onCheckboxChange($event)\"\r\n            [checked]=\"control.value?.includes(opt.value)\" class=\"form-check-input\" />\r\n          <label [for]=\"name + '_' + opt.value\" class=\"form-check-label\">{{ opt.label }}</label>\r\n        </li>\r\n      </ul>\r\n    </fieldset>\r\n  }\r\n\r\n  <!-- Checkbox button -->\r\n  @if (type === typeField.checkboxButton) {\r\n    <fieldset>\r\n      <legend [class.visually-hidden]=\"!displayLabel\">{{label}}</legend>\r\n      <div class=\"btn-group btn-group-secondary\">\r\n        <ng-container *ngFor=\"let opt of options\">\r\n          <input type=\"checkbox\" [id]=\"name + '_' + opt.value\" [value]=\"opt.value\" (change)=\"onCheckboxChange($event)\"\r\n            [checked]=\"control.value?.includes(opt.value)\" class=\"visually-hidden\" />\r\n          <label [for]=\"name + '_' + opt.value\" class=\"btn btn-form\">{{ opt.label }}</label>\r\n        </ng-container>\r\n      </div>\r\n    </fieldset>\r\n  }\r\n\r\n  <!-- Period - DateToDate / TimeToTime / DateTimeToDateTime -->\r\n  @if ([typeField.dateToDate, typeField.timeToTime, typeField.dateTimeToDateTime].includes(type) && isRange) {\r\n\r\n    <div class=\"input-group\">\r\n\r\n      <input [type]=\"getInputType()\" class=\"form-control\" [id]=\"name + '_start'\" [formControl]=\"getControl('start')\"\r\n        [attr.placeholder]=\"type === typeField.timeToTime ? ('_COMMON._DATES.FROM' | translate) : ('_COMMON._DATES.FROM_TO_1' | translate)\"\r\n        [ngClass]=\"[(cssClass || ''), getControl('start')?.value ? 'has-value' : '']\"\r\n        [attr.required]=\"isRequired ? 'required' : null\" [attr.readonly]=\"isReadonly ? 'readonly' : null\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\" [attr.aria-required]=\"isRequired\"\r\n        [attr.aria-invalid]=\"getControl('start')?.invalid && getControl('start')?.touched\"\r\n        [attr.aria-describedby]=\"getControl('start')?.invalid && getControl('start')?.touched ? 'error-' + name : null\" />\r\n\r\n      @if(getControl('start')?.value) {\r\n        <button type=\"button\" class=\"btn btn-secondary btn-clear-field\"\r\n          (click)=\"onClearFieldPeriod('start')\">\r\n          &times;\r\n        </button>\r\n      }\r\n\r\n      <input [type]=\"getInputType()\" class=\"form-control\" [id]=\"name + '_end'\" [formControl]=\"getControl('end')\"\r\n        [attr.placeholder]=\"type === typeField.timeToTime ? ('_COMMON._DATES.TO' | translate) : ('_COMMON._DATES.FROM_TO_2' | translate)\"\r\n        [ngClass]=\"[(cssClass || ''), getControl('end')?.value ? 'has-value' : '']\"\r\n        [attr.required]=\"isRequired ? 'required' : null\" [attr.readonly]=\"isReadonly ? 'readonly' : null\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\"\r\n        [attr.aria-invalid]=\"getControl('end')?.invalid && getControl('end')?.touched\"\r\n        [attr.aria-describedby]=\"getControl('end')?.invalid && getControl('end')?.touched ? 'error-' + name : null\" />\r\n\r\n      <button *ngIf=\"getControl('end')?.value\" type=\"button\" class=\"btn btn-secondary btn-clear-field\"\r\n        (click)=\"onClearFieldPeriod('end')\">\r\n        &times;\r\n      </button>\r\n    </div>\r\n  }\r\n\r\n  @if ([typeField.datePlusOne, typeField.datePlusTwo, typeField.datePlusSeven, typeField.dateComplexe].includes(type)) {\r\n    <div class=\"input-group\">\r\n\r\n      @if (type === typeField.dateComplexe) {\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onDateAddDay('prev')\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          <cw-icon font=\"optyweb\" icon=\"cw-nav-next-left\" [label]=\"'Jour pr\u00E9c\u00E9dent'\"></cw-icon>\r\n        </button>\r\n      }\r\n\r\n      <input type=\"date\" class=\"form-control\" [id]=\"name\" [formControl]=\"formControl\"\r\n        [ngClass]=\"[(cssClass || ''), formControl?.value ? 'has-value' : '']\"\r\n        [attr.placeholder]=\"placeholder ? placeholder : null\" [attr.required]=\"isRequired ? 'required' : null\"\r\n        [attr.readonly]=\"isReadonly ? 'readonly' : null\" [disabled]=\"isDisabled\" [attr.aria-required]=\"isRequired\"\r\n        [attr.aria-invalid]=\"control.invalid && control.touched\"\r\n        [attr.aria-describedby]=\"control.invalid && control.touched  ? 'error-' + name : null\" />\r\n      <button *ngIf=\"formControl?.value\" class=\"btn btn-secondary btn-clear-field\" type=\"button\"\r\n        (click)=\"onClearField(formControl)\">&times;</button>\r\n\r\n      @if (type === typeField.dateComplexe) {\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onDateAddDay('next')\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          <cw-icon font=\"optyweb\" icon=\"cw-nav-next-right\" [label]=\"'Jour suivant'\"></cw-icon>\r\n        </button>\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onRefresh()\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          <cw-icon font=\"optyweb\" icon=\"cw-toolbar-reload\" [label]=\"'Rafra\u00EEchir'\"></cw-icon>\r\n        </button>\r\n      }\r\n\r\n      <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(0)\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n        J\r\n        <span class=\"visually-hidden\">Aujourd'hui</span>\r\n      </button>\r\n      <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(1)\"\r\n        [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n        J+1\r\n        <span class=\"visually-hidden\">Demain</span>\r\n      </button>\r\n\r\n      @if (type !== typeField.datePlusOne && type !== typeField.dateComplexe) {\r\n        <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(2)\"\r\n          [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n          J+2\r\n          <span class=\"visually-hidden\">Dans 2 jours</span>\r\n        </button>\r\n\r\n        @if (type !== typeField.datePlusTwo) {\r\n          <button class=\"btn btn-secondary btn-clear-field\" type=\"button\" (click)=\"onTodayAddDay(7)\"\r\n            [attr.disabled]=\"isDisabled ? 'disabled' : null\">\r\n            J+7\r\n            <span class=\"visually-hidden\">Dans 7 jours</span>\r\n          </button>\r\n        }\r\n      }\r\n    </div>\r\n  }\r\n\r\n  @if (type === typeField.slider) {\r\n    <ngx-slider [(value)]=\"sliderValue\" [options]=\"sliderOptions\" [formControl]=\"formControl\"></ngx-slider>\r\n  }\r\n\r\n  @if (type === typeField.range) {\r\n    <div class=\"d-flex align-items-center gap-2\">\r\n      <button type=\"button\" class=\"btn slider-btn slider-btn-less\" (click)=\"onRangeStep('decrease')\"\r\n        [disabled]=\"formControl.value <= rangeOptions.floor\">\r\n        <span class=\"slider-btn-less-icon\" aria-hidden=\"true\"></span>\r\n        <span class=\"visually-hidden\">Diminuer</span>\r\n      </button>\r\n\r\n      <div class=\"slider-input flex-grow-1 position-relative\">\r\n        <label [for]=\"name\" class=\"slider-tooltip\" [style.left]=\"getRangePercent() + '%'\" aria-live=\"polite\"\r\n          aria-atomic=\"true\">\r\n          {{ label }} {{ formControl.value }}\r\n          @if (rangeOptions.unit) {\r\n            <abbr [title]=\"rangeOptions.unit\">{{ rangeOptions.unit }}</abbr>\r\n          }\r\n        </label>\r\n\r\n        <div class=\"slider-custom-bar\">\r\n          <div class=\"slider-custom-bar-selection\" [style.width]=\"getRangePercent() + '%'\">\r\n          </div>\r\n        </div>\r\n\r\n        <input type=\"range\" [id]=\"name\" [formControl]=\"formControl\" [min]=\"rangeOptions.floor\" [max]=\"rangeOptions.ceil\"\r\n          [step]=\"rangeOptions.step || 1\" class=\"form-control-range\" [attr.aria-required]=\"isRequired\"\r\n          [attr.aria-invalid]=\"control.invalid && control.touched\" [disabled]=\"isDisabled\">\r\n      </div>\r\n\r\n      <button type=\"button\" class=\"btn slider-btn slider-btn-more\" (click)=\"onRangeStep('increase')\"\r\n        [disabled]=\"formControl.value >= rangeOptions.ceil\">\r\n        <span class=\"slider-btn-more-icon optyweb cw-toolbar-add\" aria-hidden=\"true\"></span>\r\n        <span class=\"visually-hidden\">Augmenter</span>\r\n      </button>\r\n    </div>\r\n  }\r\n\r\n  @if (isInInputGroup()) {\r\n    @if(formControl?.value) {\r\n      <button class=\"btn btn-secondary btn-clear-field\" type=\"button\"\r\n      (click)=\"onClearField(formControl)\">&times;</button>\r\n    }\r\n  }\r\n\r\n</ng-template>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { control: [{
+                type: Input
+            }], formGroup: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], displayLabel: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }], rangeOptions: [{
+                type: Input
+            }], isRequired: [{
+                type: Input
+            }], help: [{
+                type: Input
+            }], tooltip: [{
+                type: Input
+            }], addonLeft: [{
+                type: Input
+            }], addonRight: [{
+                type: Input
+            }], isInAddon: [{
+                type: Input
+            }], isReadonly: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], sliderValue: [{
+                type: Input
+            }], sliderOptions: [{
+                type: Input
+            }], cssClass: [{
+                type: Input
+            }], refreshEvent: [{
+                type: Output
+            }], textChanged: [{
+                type: Output
+            }], optionTemplate: [{
+                type: ContentChild,
+                args: ['ngOptionTpl', { read: TemplateRef }]
+            }], labelTemplate: [{
+                type: ContentChild,
+                args: ['ngLabelTpl', { read: TemplateRef }]
+            }], hostClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+var LegendTypeEnum;
+(function (LegendTypeEnum) {
+    LegendTypeEnum["icon"] = "icon";
+    LegendTypeEnum["badge"] = "badge";
+    LegendTypeEnum["color"] = "color";
+})(LegendTypeEnum || (LegendTypeEnum = {}));
+
+class LegendComponent {
+    constructor() {
+        this.displayInline = false;
+        this.legendTypeEnum = LegendTypeEnum;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: LegendComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: LegendComponent, isStandalone: true, selector: "cw-legend", inputs: { legend: "legend", displayInline: "displayInline" }, ngImport: i0, template: "@if (legend.title) {\r\n  <div class=\"legend-title\">\r\n    {{ '_COMMON._TABLE.LEGEND' | translate }}\r\n  </div>\r\n}\r\n\r\n<ul class=\"legend-items\" [class.list-inline]=\"displayInline\">\r\n  @for (item of legend.data; track $index) {\r\n    <li class=\"legend-item\" [class.list-inline-item]=\"displayInline\">\r\n        @switch (item.type) {\r\n          @case (legendTypeEnum.icon) {\r\n            <cw-icon [icon]=\"item.icon\" [label]=\"item.label\" [iconCssClass]=\"'text-' + item.colorUi\" [iconColorCustom]=\"item.colorCustom\"></cw-icon>\r\n          }\r\n          @case (legendTypeEnum.badge) {\r\n            <cw-badge [type]=\"item.colorBadge\" [label]=\"item.labelBadge\"></cw-badge>\r\n            {{item.label}}\r\n          }\r\n          @case (legendTypeEnum.color) {\r\n            <span class=\"legend-item-color\" [ngClass]=\"item.colorUi ?'legend-' + item.colorUi : ''\" [style.background-color]=\"item.colorCustom\"></span>\r\n            {{item.label}}\r\n          }\r\n        }\r\n    </li>\r\n  }\r\n</ul>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "component", type: BadgeComponent, selector: "cw-badge", inputs: ["type", "label", "withIcon", "iconPosition", "cssClass", "dataTest"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: LegendComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-legend', standalone: true, imports: [
+                        CommonModule,
+                        IconComponent,
+                        BadgeComponent,
+                        TranslateModule
+                    ], template: "@if (legend.title) {\r\n  <div class=\"legend-title\">\r\n    {{ '_COMMON._TABLE.LEGEND' | translate }}\r\n  </div>\r\n}\r\n\r\n<ul class=\"legend-items\" [class.list-inline]=\"displayInline\">\r\n  @for (item of legend.data; track $index) {\r\n    <li class=\"legend-item\" [class.list-inline-item]=\"displayInline\">\r\n        @switch (item.type) {\r\n          @case (legendTypeEnum.icon) {\r\n            <cw-icon [icon]=\"item.icon\" [label]=\"item.label\" [iconCssClass]=\"'text-' + item.colorUi\" [iconColorCustom]=\"item.colorCustom\"></cw-icon>\r\n          }\r\n          @case (legendTypeEnum.badge) {\r\n            <cw-badge [type]=\"item.colorBadge\" [label]=\"item.labelBadge\"></cw-badge>\r\n            {{item.label}}\r\n          }\r\n          @case (legendTypeEnum.color) {\r\n            <span class=\"legend-item-color\" [ngClass]=\"item.colorUi ?'legend-' + item.colorUi : ''\" [style.background-color]=\"item.colorCustom\"></span>\r\n            {{item.label}}\r\n          }\r\n        }\r\n    </li>\r\n  }\r\n</ul>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { legend: [{
+                type: Input
+            }], displayInline: [{
+                type: Input
+            }] } });
+
+class LoaderComponent {
+    constructor() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: LoaderComponent, isStandalone: true, selector: "cw-loader", ngImport: i0, template: "<div class=\"loader text-center\">\r\n  <span class=\"spinner-border spinner-border-sm\" aria-hidden=\"true\"></span>\r\n  <span role=\"status\">{{ '_COMMON._HTTP.TXT_LOADING' | translate }}</span>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: LoaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-loader', standalone: true, imports: [
+                        TranslateModule
+                    ], template: "<div class=\"loader text-center\">\r\n  <span class=\"spinner-border spinner-border-sm\" aria-hidden=\"true\"></span>\r\n  <span role=\"status\">{{ '_COMMON._HTTP.TXT_LOADING' | translate }}</span>\r\n</div>\r\n" }]
+        }], ctorParameters: () => [] });
+
+var ModalsType;
+(function (ModalsType) {
+    ModalsType["delete"] = "delete";
+    ModalsType["loader"] = "loader";
+    ModalsType["quickSideView"] = "quicksideview";
+    ModalsType["custom"] = "custom";
+})(ModalsType || (ModalsType = {}));
+
+class ModalsComponent {
+    constructor(activeModal, translateService) {
+        this.activeModal = activeModal;
+        this.translateService = translateService;
+        this.itemsToDelete = [];
+        this.itemsToDeleteTitle = this.translateService.instant('_COMMON._MODAL_DELETE.DEFAULT_TYPE');
+        this.btnAction = new EventEmitter();
+        this.modalsType = ModalsType;
+        this.buttonTypeEnum = FoButtonTypeEnum && BoButtonTypeEnum;
+    }
+    ngOnInit() {
+        if (this.type === this.modalsType.quickSideView && !this.labelBtnAction) {
+            this.labelBtnAction = this.translateService.instant('_COMMON._ACTION.EDIT');
+        }
+    }
+    actionClick() {
+        this.activeModal.close();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ModalsComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ModalsComponent, isStandalone: true, selector: "cw-modals", inputs: { type: "type", modalTitle: "modalTitle", itemsToDelete: "itemsToDelete", itemsToDeleteTitle: "itemsToDeleteTitle", labelBtnAction: "labelBtnAction", customBodyTemplate: "customBodyTemplate", customBodyContext: "customBodyContext" }, outputs: { btnAction: "btnAction" }, ngImport: i0, template: "@if (type !== modalsType.loader) {\r\n  <div class=\"modal-header\">\r\n    @if (type === modalsType.delete) {\r\n      <h1 class=\"modal-title\" id=\"modal-basic-title\">\r\n        {{ '_COMMON._MODAL_DELETE.TITLE' | translate: { number: itemsToDelete.length, name: itemsToDeleteTitle } }}\r\n      </h1>\r\n    }\r\n    @else {\r\n      <h1 class=\"modal-title\" id=\"modal-basic-title\">\r\n        {{ modalTitle | translate }}\r\n      </h1>\r\n    }\r\n\r\n    <button type=\"button\" class=\"btn-close\" [attr.aria-label]=\"'_COMMON._ACTION.CLOSE' | translate\"\r\n      (click)=\"activeModal.dismiss()\" data-test-ctw=\"btn-close-modal\">\r\n    </button>\r\n  </div>\r\n\r\n  <div class=\"modal-body\">\r\n    @if (type === modalsType.delete) {\r\n      @if (itemsToDelete.length === 1) {\r\n        <div [innerHTML]=\"'_COMMON._MODAL_DELETE.SIMPLE_TEXT' | translate\"></div>\r\n      }\r\n      @if (itemsToDelete.length > 1) {\r\n        <div [innerHTML]=\"'_COMMON._MODAL_DELETE.MULTIPLE_TEXT' | translate\"></div>\r\n      }\r\n      @if (itemsToDelete.length > 0) {\r\n        <ul class=\"mb-none\">\r\n          @for (item of itemsToDelete; track item) {\r\n            <li>{{ item }}</li>\r\n          }\r\n        </ul>\r\n      }\r\n    }\r\n    @else if (type === modalsType.custom || type === modalsType.quickSideView) {\r\n      @if (customBodyTemplate) {\r\n        <ng-container [ngTemplateOutlet]=\"customBodyTemplate\" [ngTemplateOutletContext]=\"customBodyContext\">\r\n        </ng-container>\r\n      }\r\n    }\r\n  </div>\r\n\r\n  <div class=\"modal-footer\">\r\n    @if (type === modalsType.delete) {\r\n      <cw-button label=\"_COMMON._ACTION.DELETE\" [type]=\"buttonTypeEnum.primary\" [isMinWidth]=\"true\"\r\n        (btnAction)=\"actionClick()\" dataTest=\"btn-action-modal\">\r\n      </cw-button>\r\n\r\n      <cw-button label=\"_COMMON._ACTION.CANCEL\" [type]=\"buttonTypeEnum.secondary\" [isMinWidth]=\"true\"\r\n        (btnAction)=\"activeModal.dismiss()\" dataTest=\"btn-close-modal\">\r\n      </cw-button>\r\n    }\r\n    @else {\r\n      @if(labelBtnAction) {\r\n        <cw-button [label]=\"labelBtnAction | translate\" [type]=\"buttonTypeEnum.primary\" [isMinWidth]=\"true\"\r\n          (btnAction)=\"actionClick()\" dataTest=\"btn-close-modal\">\r\n        </cw-button>\r\n      }\r\n\r\n      <cw-button label=\"_COMMON._ACTION.CLOSE\" [type]=\"buttonTypeEnum.secondary\" [isMinWidth]=\"true\"\r\n        (btnAction)=\"activeModal.dismiss()\" dataTest=\"btn-close-modal\">\r\n      </cw-button>\r\n    }\r\n  </div>\r\n}\r\n\r\n@if (type === modalsType.loader) {\r\n  <div class=\"modal-body\">\r\n    <cw-loader></cw-loader>\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: ButtonComponent, selector: "cw-button", inputs: ["type", "label", "id", "isDropdown", "withIcon", "withOnlyIcon", "iconSize", "iconPosition", "dropdownPosition", "isMinWidth", "isDisabled", "withSpinner", "cssClass", "dataTest", "withTooltip", "tooltipText", "tooltipTitle", "tooltipTrigger", "tooltipPosition", "tooltipType"], outputs: ["btnAction", "dropDownClicked"] }, { kind: "component", type: LoaderComponent, selector: "cw-loader" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ModalsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-modals', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule,
+                        ButtonComponent,
+                        LoaderComponent
+                    ], template: "@if (type !== modalsType.loader) {\r\n  <div class=\"modal-header\">\r\n    @if (type === modalsType.delete) {\r\n      <h1 class=\"modal-title\" id=\"modal-basic-title\">\r\n        {{ '_COMMON._MODAL_DELETE.TITLE' | translate: { number: itemsToDelete.length, name: itemsToDeleteTitle } }}\r\n      </h1>\r\n    }\r\n    @else {\r\n      <h1 class=\"modal-title\" id=\"modal-basic-title\">\r\n        {{ modalTitle | translate }}\r\n      </h1>\r\n    }\r\n\r\n    <button type=\"button\" class=\"btn-close\" [attr.aria-label]=\"'_COMMON._ACTION.CLOSE' | translate\"\r\n      (click)=\"activeModal.dismiss()\" data-test-ctw=\"btn-close-modal\">\r\n    </button>\r\n  </div>\r\n\r\n  <div class=\"modal-body\">\r\n    @if (type === modalsType.delete) {\r\n      @if (itemsToDelete.length === 1) {\r\n        <div [innerHTML]=\"'_COMMON._MODAL_DELETE.SIMPLE_TEXT' | translate\"></div>\r\n      }\r\n      @if (itemsToDelete.length > 1) {\r\n        <div [innerHTML]=\"'_COMMON._MODAL_DELETE.MULTIPLE_TEXT' | translate\"></div>\r\n      }\r\n      @if (itemsToDelete.length > 0) {\r\n        <ul class=\"mb-none\">\r\n          @for (item of itemsToDelete; track item) {\r\n            <li>{{ item }}</li>\r\n          }\r\n        </ul>\r\n      }\r\n    }\r\n    @else if (type === modalsType.custom || type === modalsType.quickSideView) {\r\n      @if (customBodyTemplate) {\r\n        <ng-container [ngTemplateOutlet]=\"customBodyTemplate\" [ngTemplateOutletContext]=\"customBodyContext\">\r\n        </ng-container>\r\n      }\r\n    }\r\n  </div>\r\n\r\n  <div class=\"modal-footer\">\r\n    @if (type === modalsType.delete) {\r\n      <cw-button label=\"_COMMON._ACTION.DELETE\" [type]=\"buttonTypeEnum.primary\" [isMinWidth]=\"true\"\r\n        (btnAction)=\"actionClick()\" dataTest=\"btn-action-modal\">\r\n      </cw-button>\r\n\r\n      <cw-button label=\"_COMMON._ACTION.CANCEL\" [type]=\"buttonTypeEnum.secondary\" [isMinWidth]=\"true\"\r\n        (btnAction)=\"activeModal.dismiss()\" dataTest=\"btn-close-modal\">\r\n      </cw-button>\r\n    }\r\n    @else {\r\n      @if(labelBtnAction) {\r\n        <cw-button [label]=\"labelBtnAction | translate\" [type]=\"buttonTypeEnum.primary\" [isMinWidth]=\"true\"\r\n          (btnAction)=\"actionClick()\" dataTest=\"btn-close-modal\">\r\n        </cw-button>\r\n      }\r\n\r\n      <cw-button label=\"_COMMON._ACTION.CLOSE\" [type]=\"buttonTypeEnum.secondary\" [isMinWidth]=\"true\"\r\n        (btnAction)=\"activeModal.dismiss()\" dataTest=\"btn-close-modal\">\r\n      </cw-button>\r\n    }\r\n  </div>\r\n}\r\n\r\n@if (type === modalsType.loader) {\r\n  <div class=\"modal-body\">\r\n    <cw-loader></cw-loader>\r\n  </div>\r\n}\r\n" }]
+        }], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: i2.TranslateService }], propDecorators: { type: [{
+                type: Input
+            }], modalTitle: [{
+                type: Input
+            }], itemsToDelete: [{
+                type: Input
+            }], itemsToDeleteTitle: [{
+                type: Input
+            }], labelBtnAction: [{
+                type: Input
+            }], customBodyTemplate: [{
+                type: Input
+            }], customBodyContext: [{
+                type: Input
+            }], btnAction: [{
+                type: Output
+            }] } });
+
+class TabContentComponent {
+    constructor() {
+        this.disabled = false;
+        this.id = 0;
+        this.active = false;
+    }
+    get fragment() {
+        return UtilsHelper.slugify(this.title);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TabContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: TabContentComponent, isStandalone: true, selector: "cw-tab-content", inputs: { title: "title", disabled: "disabled", withIcon: "withIcon" }, ngImport: i0, template: `
+    <div class="tab-pane"
+         [class.fade]="!active"
+         [class.active]="active"
+         [class.show]="active"
+         [class.d-none]="!active"
+         [id]="'cw-nav-' + id + '-panel'"
+         role="tabpanel"
+         [attr.aria-labelledby]="'cw-nav-' + id">
+      <ng-content></ng-content>
+    </div>
+  `, isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TabContentComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'cw-tab-content',
+                    template: `
+    <div class="tab-pane"
+         [class.fade]="!active"
+         [class.active]="active"
+         [class.show]="active"
+         [class.d-none]="!active"
+         [id]="'cw-nav-' + id + '-panel'"
+         role="tabpanel"
+         [attr.aria-labelledby]="'cw-nav-' + id">
+      <ng-content></ng-content>
+    </div>
+  `,
+                    standalone: true
+                }]
+        }], propDecorators: { title: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], withIcon: [{
+                type: Input
+            }] } });
+
+var FoTabTypeEnum;
+(function (FoTabTypeEnum) {
+    FoTabTypeEnum["defaultMd"] = "default-md";
+    FoTabTypeEnum["defaultXl"] = "default-xl";
+})(FoTabTypeEnum || (FoTabTypeEnum = {}));
+var BoTabTypeEnum;
+(function (BoTabTypeEnum) {
+    BoTabTypeEnum["basic"] = "basic";
+    BoTabTypeEnum["card"] = "card";
+})(BoTabTypeEnum || (BoTabTypeEnum = {}));
+
+class TabComponent {
+    constructor(router, route) {
+        this.router = router;
+        this.route = route;
+        this.type = FoTabTypeEnum.defaultMd;
+        this.useFragment = true;
+        this.tabContentCssClass = '';
+        this.activeTabIndex = 0;
+        this.tabChanged = new EventEmitter();
+        this.activeId = 0;
+        this.iconSize = IconSizeEnum['md'];
+        this.tabTypeEnum = FoTabTypeEnum && BoTabTypeEnum;
+    }
+    ngAfterContentInit() {
+        const tabsArray = this.tabs.toArray();
+        tabsArray.forEach((tab, index) => {
+            tab.id = index;
+            tab.active = false;
+        });
+        const firstActiveIndex = tabsArray.findIndex(t => !t.disabled);
+        this.activeId = this.activeTabIndex ?? (firstActiveIndex !== -1 ? firstActiveIndex : 0);
+        if (this.useFragment) {
+            this.route.fragment.subscribe(fragment => {
+                if (fragment) {
+                    const foundIndex = tabsArray.findIndex(tab => tab.fragment === fragment && !tab.disabled);
+                    if (foundIndex !== -1) {
+                        this.activeId = foundIndex;
+                    }
+                }
+                this.activateTabByIndex(this.activeId);
+            });
+        }
+        else {
+            this.activateTabByIndex(this.activeId);
+        }
+    }
+    selectTab(tab) {
+        if (tab.disabled)
+            return;
+        this.tabs.forEach(t => t.active = false);
+        tab.active = true;
+        this.activeId = tab.id;
+        if (this.useFragment) {
+            this.router.navigate([], {
+                relativeTo: this.route,
+                fragment: tab.fragment,
+                queryParamsHandling: 'preserve',
+                replaceUrl: true
+            });
+        }
+        this.tabChanged.emit(this.activeId);
+    }
+    activateTabByIndex(index) {
+        const tab = this.tabs.toArray()[index];
+        if (tab && !tab.disabled) {
+            this.selectTab(tab);
+        }
+    }
+    onKeydown(event) {
+        switch (event.key) {
+            case 'ArrowLeft':
+                event.preventDefault();
+                this.selectPreviousTab();
+                break;
+            case 'ArrowRight':
+                event.preventDefault();
+                this.selectNextTab();
+                break;
+        }
+    }
+    moveFocus() {
+        this.tabLinks?.forEach((link) => {
+            if (link.nativeElement.getAttribute('aria-selected') === 'true') {
+                link.nativeElement.focus();
+            }
+        });
+    }
+    selectPreviousTab() {
+        const tabsArray = this.tabs.toArray();
+        const activeIndex = tabsArray.findIndex(tab => tab.active);
+        if (activeIndex !== -1) {
+            let newIndex = (activeIndex - 1 + tabsArray.length) % tabsArray.length;
+            while (tabsArray[newIndex].disabled && newIndex !== activeIndex) {
+                newIndex = (newIndex - 1 + tabsArray.length) % tabsArray.length;
+            }
+            if (!tabsArray[newIndex].disabled) {
+                this.selectTab(tabsArray[newIndex]);
+                setTimeout(() => this.moveFocus());
+            }
+        }
+    }
+    selectNextTab() {
+        const tabsArray = this.tabs.toArray();
+        const activeIndex = tabsArray.findIndex(tab => tab.active);
+        if (activeIndex !== -1) {
+            let newIndex = (activeIndex + 1) % tabsArray.length;
+            while (tabsArray[newIndex].disabled && newIndex !== activeIndex) {
+                newIndex = (newIndex + 1) % tabsArray.length;
+            }
+            if (!tabsArray[newIndex].disabled) {
+                this.selectTab(tabsArray[newIndex]);
+                setTimeout(() => this.moveFocus());
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TabComponent, deps: [{ token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: TabComponent, isStandalone: true, selector: "cw-tab", inputs: { type: "type", id: "id", useFragment: "useFragment", title: "title", tabContentCssClass: "tabContentCssClass", activeTabIndex: "activeTabIndex" }, outputs: { tabChanged: "tabChanged" }, queries: [{ propertyName: "tabs", predicate: TabContentComponent }], viewQueries: [{ propertyName: "tabLinks", predicate: ["tabLink"], descendants: true }], ngImport: i0, template: "<div class=\"tab\" [ngClass]=\"'tab-' + type\">\r\n  @if (title) {\r\n    <h2>{{ title | translate }}</h2>\r\n  }\r\n  <ul class=\"tab-items d-flex-h\" [ngClass]=\"'tab-items-' + type\" role=\"tablist\" appRwdTabs>\r\n    @for (tab of tabs.toArray(); track tab; let i = $index) {\r\n      <li class=\"tab-item\" role=\"presentation\">\r\n        <button #tabLink type=\"button\" class=\"tab-link btn\" [class.active]=\"tab.active\" [class.disabled]=\"tab.disabled\"\r\n        [disabled]=\"tab.disabled\" [attr.id]=\"'cw-nav-' + i\" [attr.data-test-ctw]=\"'link-tab-' + id + '-' + i\"\r\n        [attr.aria-selected]=\"tab.active\" [attr.aria-controls]=\"'cw-nav-' + i + '-panel'\"\r\n        [attr.tabindex]=\"tab.active ? '0' : '-1'\" (click)=\"selectTab(tab)\" (keydown)=\"onKeydown($event)\" role=\"tab\">\r\n        @if (tab.withIcon) {\r\n          <cw-icon [icon]=\"tab.withIcon\" [iconSize]=\"iconSize\"></cw-icon>\r\n        }\r\n        {{ tab.title | translate }}\r\n      </button>\r\n    </li>\r\n  }\r\n  </ul>\r\n</div>\r\n\r\n<div [class]=\"'tab-content ' + tabContentCssClass\" [ngClass]=\"'tab-content-' + type\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TabComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-tab', standalone: true, imports: [
+                        CommonModule,
+                        IconComponent,
+                        TranslateModule
+                    ], template: "<div class=\"tab\" [ngClass]=\"'tab-' + type\">\r\n  @if (title) {\r\n    <h2>{{ title | translate }}</h2>\r\n  }\r\n  <ul class=\"tab-items d-flex-h\" [ngClass]=\"'tab-items-' + type\" role=\"tablist\" appRwdTabs>\r\n    @for (tab of tabs.toArray(); track tab; let i = $index) {\r\n      <li class=\"tab-item\" role=\"presentation\">\r\n        <button #tabLink type=\"button\" class=\"tab-link btn\" [class.active]=\"tab.active\" [class.disabled]=\"tab.disabled\"\r\n        [disabled]=\"tab.disabled\" [attr.id]=\"'cw-nav-' + i\" [attr.data-test-ctw]=\"'link-tab-' + id + '-' + i\"\r\n        [attr.aria-selected]=\"tab.active\" [attr.aria-controls]=\"'cw-nav-' + i + '-panel'\"\r\n        [attr.tabindex]=\"tab.active ? '0' : '-1'\" (click)=\"selectTab(tab)\" (keydown)=\"onKeydown($event)\" role=\"tab\">\r\n        @if (tab.withIcon) {\r\n          <cw-icon [icon]=\"tab.withIcon\" [iconSize]=\"iconSize\"></cw-icon>\r\n        }\r\n        {{ tab.title | translate }}\r\n      </button>\r\n    </li>\r\n  }\r\n  </ul>\r\n</div>\r\n\r\n<div [class]=\"'tab-content ' + tabContentCssClass\" [ngClass]=\"'tab-content-' + type\">\r\n  <ng-content></ng-content>\r\n</div>\r\n" }]
+        }], ctorParameters: () => [{ type: i1$2.Router }, { type: i1$2.ActivatedRoute }], propDecorators: { type: [{
+                type: Input
+            }], id: [{
+                type: Input
+            }], useFragment: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], tabContentCssClass: [{
+                type: Input
+            }], activeTabIndex: [{
+                type: Input
+            }], tabs: [{
+                type: ContentChildren,
+                args: [TabContentComponent]
+            }], tabLinks: [{
+                type: ViewChildren,
+                args: ['tabLink']
+            }], tabChanged: [{
+                type: Output
+            }] } });
+
+class WizardStepComponent {
+    constructor() {
+        this.completed = false;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: WizardStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: WizardStepComponent, isStandalone: true, selector: "cw-wizard-step", inputs: { title: "title", completed: "completed" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: '<ng-template #content><ng-content></ng-content></ng-template>', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: WizardStepComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'cw-wizard-step',
+                    template: '<ng-template #content><ng-content></ng-content></ng-template>',
+                    standalone: true
+                }]
+        }], propDecorators: { title: [{
+                type: Input
+            }], completed: [{
+                type: Input
+            }], templateRef: [{
+                type: ViewChild,
+                args: ['content', { static: true }]
+            }] } });
+
+class WizardStepperComponent {
+    constructor() {
+        this.stepChange = new EventEmitter();
+        this.stepNext = new EventEmitter();
+        this.stepPrevious = new EventEmitter();
+        this.stepEnd = new EventEmitter();
+        this.selectedIndex = 0;
+    }
+    get stepList() {
+        return this.steps.toArray();
+    }
+    goToStep(index) {
+        if (index < 0 || index >= this.steps.length)
+            return;
+        // Vérifier que toutes les étapes précédentes sont complétées
+        for (let i = 0; i < index; i++) {
+            if (!this.steps.toArray()[i].completed) {
+                return; // Empêche d'aller à cette étape si une étape précédente n'est pas validée
+            }
+        }
+        this.selectedIndex = index;
+        this.stepChange.emit(this.selectedIndex);
+    }
+    nextStep() {
+        if (this.selectedIndex < this.steps.length - 1) {
+            const currentStep = this.steps.toArray()[this.selectedIndex];
+            if (!currentStep.completed) {
+                // Si l'étape courante n'est pas validée, on bloque
+                return;
+            }
+            this.selectedIndex++;
+            this.stepNext.emit(this.selectedIndex);
+            this.stepChange.emit(this.selectedIndex);
+        }
+    }
+    previousStep() {
+        if (this.selectedIndex > 0) {
+            this.selectedIndex--;
+            this.stepPrevious.emit(this.selectedIndex);
+            this.stepChange.emit(this.selectedIndex);
+        }
+    }
+    endWizard() {
+        if (this.selectedIndex > 0) {
+            this.stepEnd.emit(this.selectedIndex);
+            this.stepChange.emit(this.selectedIndex);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: WizardStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: WizardStepperComponent, isStandalone: true, selector: "cw-wizard-stepper", outputs: { stepChange: "stepChange", stepNext: "stepNext", stepPrevious: "stepPrevious", stepEnd: "stepEnd" }, queries: [{ propertyName: "steps", predicate: WizardStepComponent }], ngImport: i0, template: "<nav>\r\n  <ul class=\"list-inline step-list\">\r\n    @for (step of steps.toArray(); track step; let i = $index) {\r\n      <li class=\"list-inline-item step-item\">\r\n        <button class=\"btn step-button\" [ngClass]=\"{\r\n              'step-active': selectedIndex === i,\r\n              'step-completed': step.completed,\r\n              'step-current': selectedIndex === i && step.completed === false\r\n            }\" [disabled]=\"(i > 0 && !steps.toArray()[i - 1]?.completed)\" (click)=\"goToStep(i)\" type=\"button\">\r\n          <span class=\"step-indicator bo-icons bo-alert-success\" aria-hidden=\"true\"></span>\r\n          <span class=\"step-label\">\r\n            {{ step.title || ('_COMMON._STEPPER.STEP' | translate) + (i + 1) }}\r\n          </span>\r\n        </button>\r\n      </li>\r\n    }\r\n  </ul>\r\n</nav>\r\n\r\n@for (step of steps.toArray(); track step; let i = $index) {\r\n  <section class=\"tab-pane\" [class.active]=\"selectedIndex === i\" [hidden]=\"selectedIndex !== i\" role=\"tabpanel\">\r\n    <ng-container *ngTemplateOutlet=\"step.templateRef\"></ng-container>\r\n  </section>\r\n}\r\n\r\n<div class=\"text-center mt-5\">\r\n  <div class=\"btn-group\">\r\n    <button class=\"btn btn-secondary btn-min-width\" (click)=\"previousStep()\" [disabled]=\"selectedIndex === 0\"\r\n      type=\"button\">\r\n      {{ '_COMMON._STEPPER.PREVIOUS_STEP' | translate }}\r\n    </button>\r\n\r\n    @if (selectedIndex !== steps.length - 1) {\r\n      <button class=\"btn btn-primary btn-min-width\" (click)=\"nextStep()\"\r\n        [disabled]=\"!steps.toArray()[selectedIndex]?.completed\" type=\"button\">\r\n        {{ '_COMMON._STEPPER.NEXT_STEP' | translate }}\r\n      </button>\r\n    }\r\n    @else {\r\n      <button class=\"btn btn-primary btn-min-width\" (click)=\"endWizard()\" type=\"button\">\r\n        {{ '_COMMON._ACTION.END' | translate }}\r\n      </button>\r\n    }\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: WizardStepperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-wizard-stepper', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule
+                    ], template: "<nav>\r\n  <ul class=\"list-inline step-list\">\r\n    @for (step of steps.toArray(); track step; let i = $index) {\r\n      <li class=\"list-inline-item step-item\">\r\n        <button class=\"btn step-button\" [ngClass]=\"{\r\n              'step-active': selectedIndex === i,\r\n              'step-completed': step.completed,\r\n              'step-current': selectedIndex === i && step.completed === false\r\n            }\" [disabled]=\"(i > 0 && !steps.toArray()[i - 1]?.completed)\" (click)=\"goToStep(i)\" type=\"button\">\r\n          <span class=\"step-indicator bo-icons bo-alert-success\" aria-hidden=\"true\"></span>\r\n          <span class=\"step-label\">\r\n            {{ step.title || ('_COMMON._STEPPER.STEP' | translate) + (i + 1) }}\r\n          </span>\r\n        </button>\r\n      </li>\r\n    }\r\n  </ul>\r\n</nav>\r\n\r\n@for (step of steps.toArray(); track step; let i = $index) {\r\n  <section class=\"tab-pane\" [class.active]=\"selectedIndex === i\" [hidden]=\"selectedIndex !== i\" role=\"tabpanel\">\r\n    <ng-container *ngTemplateOutlet=\"step.templateRef\"></ng-container>\r\n  </section>\r\n}\r\n\r\n<div class=\"text-center mt-5\">\r\n  <div class=\"btn-group\">\r\n    <button class=\"btn btn-secondary btn-min-width\" (click)=\"previousStep()\" [disabled]=\"selectedIndex === 0\"\r\n      type=\"button\">\r\n      {{ '_COMMON._STEPPER.PREVIOUS_STEP' | translate }}\r\n    </button>\r\n\r\n    @if (selectedIndex !== steps.length - 1) {\r\n      <button class=\"btn btn-primary btn-min-width\" (click)=\"nextStep()\"\r\n        [disabled]=\"!steps.toArray()[selectedIndex]?.completed\" type=\"button\">\r\n        {{ '_COMMON._STEPPER.NEXT_STEP' | translate }}\r\n      </button>\r\n    }\r\n    @else {\r\n      <button class=\"btn btn-primary btn-min-width\" (click)=\"endWizard()\" type=\"button\">\r\n        {{ '_COMMON._ACTION.END' | translate }}\r\n      </button>\r\n    }\r\n  </div>\r\n</div>\r\n" }]
+        }], propDecorators: { steps: [{
+                type: ContentChildren,
+                args: [WizardStepComponent]
+            }], stepChange: [{
+                type: Output
+            }], stepNext: [{
+                type: Output
+            }], stepPrevious: [{
+                type: Output
+            }], stepEnd: [{
+                type: Output
+            }] } });
+
+class StepperComponent {
+    constructor() {
+        this.activeStep = 0;
+        this.steps = [];
+        this.label = 'Étapes de progression'; // todo trad
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: StepperComponent, isStandalone: true, selector: "cw-stepper", inputs: { activeStep: "activeStep", steps: "steps", label: "label" }, ngImport: i0, template: "<ul class=\"stepper\" role=\"list\" [attr.aria-label]=\"label\">\r\n  @for (step of steps; track step; let i = $index) {\r\n    <li id=\"step-{{i}}\" class=\"stepper-item\" [ngClass]=\"{\r\n          'stepper-item-current': i === activeStep,\r\n          'stepper-item-completed': i < activeStep}\"\r\n      [attr.aria-current]=\"i === activeStep ? 'step' : null\">\r\n      <span class=\"stepper-label\">\r\n        <span class=\"visually-hidden\">{{i + 1}}</span>\r\n        {{step | translate}}\r\n      </span>\r\n    </li>\r\n  }\r\n</ul>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: StepperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-stepper', standalone: true, imports: [
+                        CommonModule,
+                        TranslateModule
+                    ], template: "<ul class=\"stepper\" role=\"list\" [attr.aria-label]=\"label\">\r\n  @for (step of steps; track step; let i = $index) {\r\n    <li id=\"step-{{i}}\" class=\"stepper-item\" [ngClass]=\"{\r\n          'stepper-item-current': i === activeStep,\r\n          'stepper-item-completed': i < activeStep}\"\r\n      [attr.aria-current]=\"i === activeStep ? 'step' : null\">\r\n      <span class=\"stepper-label\">\r\n        <span class=\"visually-hidden\">{{i + 1}}</span>\r\n        {{step | translate}}\r\n      </span>\r\n    </li>\r\n  }\r\n</ul>\r\n" }]
+        }], propDecorators: { activeStep: [{
+                type: Input
+            }], steps: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }] } });
+
+const FILE_SIZE_UNITS_FR = ['o', 'Ko', 'Mo', 'Go', 'To', 'Po', 'Eo', 'Zo', 'Yo'];
+const FILE_SIZE_UNITS_DEFAULT = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
+class FormatFileSizePipe {
+    constructor() {
+        this.translate = inject(TranslateService);
+    }
+    transform(sizeInBytes) {
+        const units = this.translate.currentLang === 'fr' ? FILE_SIZE_UNITS_FR : FILE_SIZE_UNITS_DEFAULT;
+        let power = Math.round(Math.log(sizeInBytes) / Math.log(1024));
+        power = Math.min(power, units.length - 1);
+        const size = sizeInBytes / Math.pow(1024, power); // size in new units
+        const formattedSize = Math.round(size * 10) / 10; // keep up to 1 decimal
+        const unit = units[power];
+        return `${formattedSize} ${unit}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FormatFileSizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: FormatFileSizePipe, isStandalone: true, name: "formatFileSize" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FormatFileSizePipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'formatFileSize' }]
+        }] });
+
+class FileToDownloadComponent {
+    constructor() {
+        this.translate = inject(TranslateService);
+        this.iconType = IconTypeEnum;
+        this.iconSize = IconSizeEnum;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FileToDownloadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FileToDownloadComponent, isStandalone: true, selector: "cw-file-to-download", inputs: { attachments: "attachments" }, ngImport: i0, template: "<!-- If one file  -->\r\n@if (attachments.length === 1 ) {\r\n<ng-container *ngTemplateOutlet=\"file;context:{attachment:attachments[0]}\"></ng-container>\r\n}\r\n\r\n<!-- If two files or more, li loop -->\r\n@if (attachments.length > 1) {\r\n<ul class=\"list-unstyled file-to-download-items\">\r\n  @for (attachment of attachments; track attachment) {\r\n  <li class=\"file-to-download-list-item\">\r\n    <ng-container *ngTemplateOutlet=\"file;context:{attachment:attachment}\"></ng-container>\r\n  </li>\r\n  }\r\n</ul>\r\n}\r\n\r\n<ng-template #file let-attachment=\"attachment\">\r\n  <a [href]=\"attachment.url\" class=\"file-to-download-link\" target=\"_blank\">\r\n    <span class=\"file-to-download-name\">\r\n      {{ attachment.label ? attachment.label : ('_SHARED.ATTACHMENT_DEFAULT_LABEL' | translate ) }}\r\n    </span>\r\n    <span class=\"file-to-download-info\">\r\n      @if (attachment.extension && attachment.size) {\r\n      {{attachment.extension.toUpperCase()}} {{attachment.size * 1024 | formatFileSize}}\r\n      }\r\n      <cw-icon icon=\"cw-toolbar-download\" font=\"optyweb\" [label]=\"'_COMMON.NEW_WINDOW' |translate\" [type]=\"iconType.default\"\r\n        [iconSize]=\"iconSize['md']\" iconCssClass=\"file-to-download-download\"></cw-icon>\r\n    </span>\r\n  </a>\r\n</ng-template>\r\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: FormatFileSizePipe, name: "formatFileSize" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FileToDownloadComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-file-to-download', imports: [NgTemplateOutlet, TranslatePipe, FormatFileSizePipe, IconComponent], template: "<!-- If one file  -->\r\n@if (attachments.length === 1 ) {\r\n<ng-container *ngTemplateOutlet=\"file;context:{attachment:attachments[0]}\"></ng-container>\r\n}\r\n\r\n<!-- If two files or more, li loop -->\r\n@if (attachments.length > 1) {\r\n<ul class=\"list-unstyled file-to-download-items\">\r\n  @for (attachment of attachments; track attachment) {\r\n  <li class=\"file-to-download-list-item\">\r\n    <ng-container *ngTemplateOutlet=\"file;context:{attachment:attachment}\"></ng-container>\r\n  </li>\r\n  }\r\n</ul>\r\n}\r\n\r\n<ng-template #file let-attachment=\"attachment\">\r\n  <a [href]=\"attachment.url\" class=\"file-to-download-link\" target=\"_blank\">\r\n    <span class=\"file-to-download-name\">\r\n      {{ attachment.label ? attachment.label : ('_SHARED.ATTACHMENT_DEFAULT_LABEL' | translate ) }}\r\n    </span>\r\n    <span class=\"file-to-download-info\">\r\n      @if (attachment.extension && attachment.size) {\r\n      {{attachment.extension.toUpperCase()}} {{attachment.size * 1024 | formatFileSize}}\r\n      }\r\n      <cw-icon icon=\"cw-toolbar-download\" font=\"optyweb\" [label]=\"'_COMMON.NEW_WINDOW' |translate\" [type]=\"iconType.default\"\r\n        [iconSize]=\"iconSize['md']\" iconCssClass=\"file-to-download-download\"></cw-icon>\r\n    </span>\r\n  </a>\r\n</ng-template>\r\n" }]
+        }], propDecorators: { attachments: [{
+                type: Input
+            }] } });
+
+var NumericalRangeTypeEnum;
+(function (NumericalRangeTypeEnum) {
+    NumericalRangeTypeEnum["defaultWhite"] = "default-white";
+    NumericalRangeTypeEnum["defaultGrey"] = "default-grey";
+    NumericalRangeTypeEnum["smallWhite"] = "small-white";
+    NumericalRangeTypeEnum["smalltGrey"] = "small-grey";
+    NumericalRangeTypeEnum["largeWhite"] = "large-white";
+    NumericalRangeTypeEnum["largeGrey"] = "large-grey";
+})(NumericalRangeTypeEnum || (NumericalRangeTypeEnum = {}));
+var NumericalRangeLabelPositionEnum;
+(function (NumericalRangeLabelPositionEnum) {
+    NumericalRangeLabelPositionEnum["inside"] = "inside";
+    NumericalRangeLabelPositionEnum["outside"] = "outside";
+})(NumericalRangeLabelPositionEnum || (NumericalRangeLabelPositionEnum = {}));
+
+class NumericalRangeComponent {
+    constructor() {
+        this.type = NumericalRangeTypeEnum.defaultGrey;
+        this.label = '';
+        this.amount = 0;
+        this.withLabelVisible = true;
+        this.labelPosition = NumericalRangeLabelPositionEnum.inside;
+        this.ceil = 9;
+        this.floor = 0;
+        this.isDisabled = false;
+        this.autoChangeAmount = true;
+        this.newAmount = new EventEmitter();
+        this.numericalRangeType = NumericalRangeTypeEnum;
+        this.iconTypeEnum = IconTypeEnum;
+        this.iconSize = IconSizeEnum;
+        this.labelPositionValue = NumericalRangeLabelPositionEnum;
+        this.buttonType = FoButtonTypeEnum && BoButtonTypeEnum;
+        this.buttonIconSize = ButtonIconSizeEnum;
+    }
+    ngOnInit() {
+        // this.elementRef.nativeElement.classList.add('dropdown-item');
+        // this.elementRef.nativeElement.setAttribute('tabindex', '0');
+    }
+    increaseAmount() {
+        const amount = this.amount + 1;
+        if (this.autoChangeAmount) {
+            this.amount = amount;
+        }
+        this.newAmount.emit(amount);
+    }
+    decreaseAmount() {
+        const amount = this.amount - 1;
+        if (this.autoChangeAmount) {
+            this.amount = amount;
+            if (this.amount < this.floor) {
+                this.amount = this.floor;
+            }
+        }
+        this.newAmount.emit(amount);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NumericalRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: NumericalRangeComponent, isStandalone: true, selector: "cw-numerical-range", inputs: { type: "type", label: "label", amount: "amount", withIcon: "withIcon", withLabelVisible: "withLabelVisible", labelPosition: "labelPosition", ceil: "ceil", floor: "floor", isDisabled: "isDisabled", autoChangeAmount: "autoChangeAmount" }, outputs: { newAmount: "newAmount" }, ngImport: i0, template: "<div class=\"numerical-range text-center\" [ngClass]=\"'numerical-range-' + type\">\r\n  @if (labelPosition == labelPositionValue.outside) {\r\n    @if (withLabelVisible) {\r\n      <div class=\"numerical-range-label\">\r\n        @if (withIcon && (type == numericalRangeType.largeWhite || type == numericalRangeType.largeGrey)) {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSize['lg']\"></cw-icon>\r\n        }\r\n        <span>{{ label }}</span>\r\n      </div>\r\n    }\r\n  }\r\n  <div class=\"numerical-range-container\">\r\n\r\n    <cw-button [isDisabled]=\"isDisabled || amount <= floor\" label=\"Augmenter la valeur de 1\"\r\n      withIcon=\"optyweb cw-toolbar-add\" [withOnlyIcon]=\"true\" [type]=\"buttonType.primary\" [iconSize]=\"buttonIconSize.small\"\r\n      (btnAction)=\"decreaseAmount()\"></cw-button>\r\n\r\n    <div class=\"numerical-range-wrapper\">\r\n      <div class=\"numerical-range-amount\">\r\n        {{ amount }}\r\n      </div>\r\n\r\n      @if ((type !== numericalRangeType.largeGrey && type !== numericalRangeType.largeWhite) && (withIcon || withLabelVisible)) {\r\n        <div class=\"numerical-range-label\">\r\n          @if (withLabelVisible && labelPosition == labelPositionValue.inside) {\r\n            @if (withIcon) {\r\n              <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSize['lg']\"></cw-icon>\r\n            }\r\n            <span>{{ label }}</span>\r\n          }\r\n          @else {\r\n            @if (withIcon) {\r\n              <cw-icon [icon]=\"withIcon\" [label]=\"label\" [iconSize]=\"iconSize['lg']\"></cw-icon>\r\n            }\r\n          }\r\n        </div>\r\n      }\r\n      </div>\r\n    <cw-button [isDisabled]=\"isDisabled || amount >= ceil\" label=\"Dimiuer la valeur de 1\"\r\n      withIcon=\"optyweb cw-toolbar-add\" [withOnlyIcon]=\"true\" [type]=\"buttonType.primary\" [iconSize]=\"buttonIconSize.small\"\r\n      (btnAction)=\"increaseAmount()\"></cw-button>\r\n  </div>\r\n\r\n</div>\r\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconComponent, selector: "cw-icon", inputs: ["icon", "font", "label", "type", "iconSize", "iconCssClass", "iconUiType", "iconColorCustom"] }, { kind: "component", type: ButtonComponent, selector: "cw-button", inputs: ["type", "label", "id", "isDropdown", "withIcon", "withOnlyIcon", "iconSize", "iconPosition", "dropdownPosition", "isMinWidth", "isDisabled", "withSpinner", "cssClass", "dataTest", "withTooltip", "tooltipText", "tooltipTitle", "tooltipTrigger", "tooltipPosition", "tooltipType"], outputs: ["btnAction", "dropDownClicked"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NumericalRangeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-numerical-range', imports: [NgClass, IconComponent, ButtonComponent], standalone: true, template: "<div class=\"numerical-range text-center\" [ngClass]=\"'numerical-range-' + type\">\r\n  @if (labelPosition == labelPositionValue.outside) {\r\n    @if (withLabelVisible) {\r\n      <div class=\"numerical-range-label\">\r\n        @if (withIcon && (type == numericalRangeType.largeWhite || type == numericalRangeType.largeGrey)) {\r\n          <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSize['lg']\"></cw-icon>\r\n        }\r\n        <span>{{ label }}</span>\r\n      </div>\r\n    }\r\n  }\r\n  <div class=\"numerical-range-container\">\r\n\r\n    <cw-button [isDisabled]=\"isDisabled || amount <= floor\" label=\"Augmenter la valeur de 1\"\r\n      withIcon=\"optyweb cw-toolbar-add\" [withOnlyIcon]=\"true\" [type]=\"buttonType.primary\" [iconSize]=\"buttonIconSize.small\"\r\n      (btnAction)=\"decreaseAmount()\"></cw-button>\r\n\r\n    <div class=\"numerical-range-wrapper\">\r\n      <div class=\"numerical-range-amount\">\r\n        {{ amount }}\r\n      </div>\r\n\r\n      @if ((type !== numericalRangeType.largeGrey && type !== numericalRangeType.largeWhite) && (withIcon || withLabelVisible)) {\r\n        <div class=\"numerical-range-label\">\r\n          @if (withLabelVisible && labelPosition == labelPositionValue.inside) {\r\n            @if (withIcon) {\r\n              <cw-icon [icon]=\"withIcon\" [iconSize]=\"iconSize['lg']\"></cw-icon>\r\n            }\r\n            <span>{{ label }}</span>\r\n          }\r\n          @else {\r\n            @if (withIcon) {\r\n              <cw-icon [icon]=\"withIcon\" [label]=\"label\" [iconSize]=\"iconSize['lg']\"></cw-icon>\r\n            }\r\n          }\r\n        </div>\r\n      }\r\n      </div>\r\n    <cw-button [isDisabled]=\"isDisabled || amount >= ceil\" label=\"Dimiuer la valeur de 1\"\r\n      withIcon=\"optyweb cw-toolbar-add\" [withOnlyIcon]=\"true\" [type]=\"buttonType.primary\" [iconSize]=\"buttonIconSize.small\"\r\n      (btnAction)=\"increaseAmount()\"></cw-button>\r\n  </div>\r\n\r\n</div>\r\n" }]
+        }], propDecorators: { type: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], amount: [{
+                type: Input
+            }], withIcon: [{
+                type: Input
+            }], withLabelVisible: [{
+                type: Input
+            }], labelPosition: [{
+                type: Input
+            }], ceil: [{
+                type: Input
+            }], floor: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], autoChangeAmount: [{
+                type: Input
+            }], newAmount: [{
+                type: Output
+            }] } });
+
+class ImageComponent {
+    constructor() {
+        this.source = '';
+        this.alt = '';
+        this.isAriaHidden = false;
+        this.cssClass = '';
+        this.width = '';
+        this.height = '';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: ImageComponent, isStandalone: true, selector: "cw-image", inputs: { source: "source", alt: "alt", isAriaHidden: "isAriaHidden", cssClass: "cssClass", width: "width", height: "height" }, ngImport: i0, template: "<img [src]=\"source\" [attr.aria-hidden]=\"isAriaHidden ? 'true' : null\" [class]=\"cssClass\" [alt]=\"alt\"\r\n  [attr.width]=\"width ? width : null\" [attr.height]=\"height ? height : null\">\r\n" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ImageComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cw-image', standalone: true, template: "<img [src]=\"source\" [attr.aria-hidden]=\"isAriaHidden ? 'true' : null\" [class]=\"cssClass\" [alt]=\"alt\"\r\n  [attr.width]=\"width ? width : null\" [attr.height]=\"height ? height : null\">\r\n" }]
+        }], propDecorators: { source: [{
+                type: Input
+            }], alt: [{
+                type: Input
+            }], isAriaHidden: [{
+                type: Input
+            }], cssClass: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }] } });
+
+var PlacementEnum;
+(function (PlacementEnum) {
+    PlacementEnum["Left"] = "left";
+    PlacementEnum["Right"] = "right";
+})(PlacementEnum || (PlacementEnum = {}));
+
+class ModalsService {
+    constructor(modalService) {
+        this.modalService = modalService;
+    }
+    openModal(type, config, sizeOverride) {
+        const size = sizeOverride ?? this.getModalSizeByType(type);
+        const modalRef = this.modalService.open(ModalsComponent, {
+            centered: true,
+            size,
+            backdrop: type === ModalsType.loader ? 'static' : true,
+            ariaLabelledBy: 'modal-basic-title',
+            keyboard: type !== ModalsType.loader,
+            windowClass: type === ModalsType.quickSideView ? 'quick-view-modal' : null,
+            scrollable: type === ModalsType.quickSideView
+        });
+        modalRef.componentInstance.type = type;
+        if (config) {
+            Object.assign(modalRef.componentInstance, config);
+        }
+        return modalRef;
+    }
+    getModalSizeByType(type) {
+        switch (type) {
+            case ModalsType.loader:
+                return 'sm';
+            case ModalsType.delete:
+                return 'md';
+            case ModalsType.quickSideView:
+                return 'lg';
+            default:
+                return 'md';
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ModalsService, deps: [{ token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ModalsService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ModalsService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: i1$1.NgbModal }] });
+
+/*
+ * Public API Surface of basic-ui
+ */
+// LIB UI
+//---------------------------------------------------------
+// Lib ui components
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AccordionComponent, AlertComponent, AlertTypeEnum, BadgeComponent, BadgePositionEnum, BadgeTypeEnum, BoButtonTypeEnum, BoTabTypeEnum, ButtonComponent, ButtonIconSizeEnum, ButtonPositionEnum, CardComponent, CardTitleRankEnum, CardTypeEnum, ClickOutsideDirective, CollapseDirective, DropdownComponent, DropdownItemDirective, FileToDownloadComponent, FoButtonTypeEnum, FoTabTypeEnum, FocusTrackerService, FormFieldComponent, FormFieldTypeEnum, IconComponent, IconNotifSizeEnum, IconNotifTypeEnum, IconNotificationComponent, IconSizeEnum, IconTypeEnum, IconUiTypeEnum, ImageComponent, LegendComponent, LegendTypeEnum, LoaderComponent, ModalsComponent, ModalsService, ModalsType, NumericalRangeComponent, NumericalRangeLabelPositionEnum, NumericalRangeTypeEnum, PlacementEnum, ResponsiveService, StepperComponent, TabComponent, TabContentComponent, ToastComponent, ToastService, TriggerTooltipEnum, TypeTooltipEnum, WizardStepComponent, WizardStepperComponent, rangeValidator };
+//# sourceMappingURL=cityway-basic-ui.mjs.map