cilog-lib 1.13.22 → 1.13.24

package/fesm2022/cilog-lib.mjs

@@ -36,11 +36,17 @@ import * as FileSaver from 'file-saver';
 import { AgGridAngular } from 'ag-grid-angular';
 import { themeQuartz, ModuleRegistry, AllCommunityModule } from 'ag-grid-community';
 import { AG_GRID_LOCALE_FR } from '@ag-grid-community/locale';
-import * as i2$1 from 'primeng/treetable';
+import * as i2$1 from '@angular/material/form-field';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i3$2 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import * as i4$1 from '@angular/cdk/scrolling';
+import { ScrollingModule } from '@angular/cdk/scrolling';
+import * as i2$2 from 'primeng/treetable';
 import { TreeTableModule } from 'primeng/treetable';
-import * as i2$2 from 'primeng/editor';
+import * as i2$3 from 'primeng/editor';
 import { EditorModule } from 'primeng/editor';
-import * as i2$3 from '@angular/router';
+import * as i2$4 from '@angular/router';
 import { NavigationEnd } from '@angular/router';
 import { filter, map, distinctUntilChanged } from 'rxjs';
 import * as i5$1 from 'primeng/progressspinner';
@@ -1494,22 +1500,24 @@ class GridSetFilterComponent {
     onSelectionChange() {
         this.params.filterChangedCallback();
     }
-    onDropdownOpen(select) {
-        setTimeout(() => {
-            if (select && select.alignOverlay) {
-                select.alignOverlay();
-            }
-        }, 0);
-    }
+    compareFn = (item1, item2) => {
+        if (!item1 || !item2)
+            return item1 === item2;
+        const key1 = item1.id !== undefined ? item1.id : item1[this.optionLabel];
+        const key2 = item2.id !== undefined ? item2.id : item2[this.optionLabel];
+        return key1 === key2;
+    };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: GridSetFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: GridSetFilterComponent, isStandalone: true, selector: "cilog-grid-set-filter", ngImport: i0, template: "<div style=\"padding: 10px; min-width: 220px;\">\r\n    <p-multiselect #multiSelect\r\n                   [options]=\"options\"\r\n                   [(ngModel)]=\"selectedValues\"\r\n                   [optionLabel]=\"optionLabel\"\r\n                   (onChange)=\"onSelectionChange()\"\r\n                   placeholder=\"S\u00E9lectionner...\"\r\n                   selectedItemsLabel=\"{0} \u00E9l\u00E9ments s\u00E9lectionn\u00E9s\"\r\n                   [maxSelectedLabels]=\"1\"\r\n                   [virtualScroll]=\"true\"\r\n                   [virtualScrollItemSize]=\"30\"\r\n                   [style]=\"{ width: '100%' }\"\r\n                   [panelStyle]=\"{ minWidth: '220px' }\"\r\n                   [appendTo]=\"'body'\"\r\n                   (onPanelShow)=\"onDropdownOpen(multiSelect)\">\r\n    </p-multiselect>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i10.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: GridSetFilterComponent, isStandalone: true, selector: "cilog-grid-set-filter", ngImport: i0, template: "<mat-form-field appearance=\"outline\"\r\n                style=\"width: 100%; max-width: 400px;\">\r\n    <mat-label>S\u00E9lectionner...</mat-label>\r\n    <mat-select [(ngModel)]=\"selectedValues\"\r\n                name=\"gridFilterSelect\"\r\n                [compareWith]=\"compareFn\"\r\n                (selectionChange)=\"onSelectionChange()\"\r\n                multiple>\r\n        <cdk-virtual-scroll-viewport itemSize=\"35\"\r\n                                     class=\"select-viewport\">\r\n            <mat-option *cdkVirtualFor=\"let item of options\"\r\n                        [value]=\"item\">\r\n                {{ item[optionLabel] }}\r\n            </mat-option>\r\n        </cdk-virtual-scroll-viewport>\r\n    </mat-select>\r\n</mat-form-field>\r\n", styles: [":host ::ng-deep .select-viewport{height:200px;width:100%}:host ::ng-deep .mat-mdc-option{min-height:32px!important;height:32px!important}:host ::ng-deep .mat-mdc-form-field-infix{padding-top:4px!important;padding-bottom:4px!important;min-height:unset!important}:host ::ng-deep .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:50%!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i4$1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i4$1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i4$1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: GridSetFilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cilog-grid-set-filter', imports: [
-                        MultiSelectModule,
-                        FormsModule
-                    ], template: "<div style=\"padding: 10px; min-width: 220px;\">\r\n    <p-multiselect #multiSelect\r\n                   [options]=\"options\"\r\n                   [(ngModel)]=\"selectedValues\"\r\n                   [optionLabel]=\"optionLabel\"\r\n                   (onChange)=\"onSelectionChange()\"\r\n                   placeholder=\"S\u00E9lectionner...\"\r\n                   selectedItemsLabel=\"{0} \u00E9l\u00E9ments s\u00E9lectionn\u00E9s\"\r\n                   [maxSelectedLabels]=\"1\"\r\n                   [virtualScroll]=\"true\"\r\n                   [virtualScrollItemSize]=\"30\"\r\n                   [style]=\"{ width: '100%' }\"\r\n                   [panelStyle]=\"{ minWidth: '220px' }\"\r\n                   [appendTo]=\"'body'\"\r\n                   (onPanelShow)=\"onDropdownOpen(multiSelect)\">\r\n    </p-multiselect>\r\n</div>\r\n" }]
+                        FormsModule,
+                        MatFormFieldModule,
+                        MatSelectModule,
+                        ScrollingModule
+                    ], template: "<mat-form-field appearance=\"outline\"\r\n                style=\"width: 100%; max-width: 400px;\">\r\n    <mat-label>S\u00E9lectionner...</mat-label>\r\n    <mat-select [(ngModel)]=\"selectedValues\"\r\n                name=\"gridFilterSelect\"\r\n                [compareWith]=\"compareFn\"\r\n                (selectionChange)=\"onSelectionChange()\"\r\n                multiple>\r\n        <cdk-virtual-scroll-viewport itemSize=\"35\"\r\n                                     class=\"select-viewport\">\r\n            <mat-option *cdkVirtualFor=\"let item of options\"\r\n                        [value]=\"item\">\r\n                {{ item[optionLabel] }}\r\n            </mat-option>\r\n        </cdk-virtual-scroll-viewport>\r\n    </mat-select>\r\n</mat-form-field>\r\n", styles: [":host ::ng-deep .select-viewport{height:200px;width:100%}:host ::ng-deep .mat-mdc-option{min-height:32px!important;height:32px!important}:host ::ng-deep .mat-mdc-form-field-infix{padding-top:4px!important;padding-bottom:4px!important;min-height:unset!important}:host ::ng-deep .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:50%!important}\n"] }]
         }] });
 
 const myTheme = themeQuartz
@@ -1760,27 +1768,7 @@ class CilogGridComponent {
                         fontWeight: params.data[params.colDef.field].bold ? 'bold' : null,
                         fontStyle: params.data[params.colDef.field].italic ? 'italic' : null
                     };
-                },
-                comparator: (valueA, valueB, nodeA, nodeB, isDescending) => {
-                    if (!valueA && !valueB)
-                        return 0;
-                    if (!valueA)
-                        return -1;
-                    if (!valueB)
-                        return 1;
-                    switch (col.type) {
-                        case ColType.Number:
-                            return valueA - valueB;
-                        case ColType.Dropdown:
-                            const labelA = valueA[col.options['optionLabel']];
-                            const labelB = valueB[col.options['optionLabel']];
-                            return labelA.localeCompare(labelB);
-                        case ColType.Date:
-                            return new Date(valueA).getTime() - new Date(valueB).getTime();
-                        default:
-                            return String(valueA).localeCompare(String(valueB));
-                    }
-                },
+                }
             };
             cols.push(colDef);
         });
@@ -2034,7 +2022,7 @@ class CilogTreetableComponent {
     ngOnInit() {
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CilogTreetableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: CilogTreetableComponent, isStandalone: true, selector: "cilog-treetable", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: true, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange", values: "valuesChange" }, ngImport: i0, template: "<div class=\"!relative\"\r\n     [ngStyle]=\"{ 'height': options().scrollHeight != null ? options().scrollHeight : '100%' }\">\r\n    \r\n    <p-treetable #table\r\n                 [columns]=\"optimizedColumns()\"\r\n                 [value]=\"values()\"\r\n                 dataKey=\"key\"\r\n                 filterBy=\"key\"\r\n                 [scrollable]=\"true\"\r\n                 [scrollHeight]=\"'flex'\"\r\n                 [loading]=\"loading()\"\r\n                 [tableStyleClass]=\"!options().themeGrille ? 'grid_grey' : options().themeGrille\"\r\n                 [resizableColumns]=\"options().resizableColumns\"\r\n                 columnResizeMode=\"expand\">\r\n        <ng-template #colgroup let-columns>\r\n            <colgroup>\r\n                @for (col of columns; track col.id) {\r\n                <col />\r\n                }\r\n            </colgroup>\r\n        </ng-template>\r\n        <ng-template #header let-columns>\r\n            <tr class=\"rowHeader\">\r\n                @for (col of columns; track col.id) {\r\n                @if (!col.invisible) {\r\n                <th [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': col.backgroundColor ? col.backgroundColor : null }\"\r\n                    [ngClass]=\"{ '!text-center' : options().centerHeaders, 'headerAffichageSimple': !options().headersAffichageEntier, 'headerAffichageEntier': options().headersAffichageEntier }\"\r\n                    id=\"{{ col.id }}\"\r\n                    [pTooltip]=\"col.libelle\"\r\n                    [tooltipDisabled]=\"!col.tooltipHeader\"\r\n                    tooltipPosition=\"bottom\"\r\n                    ttResizableColumn\r\n                    [ttResizableColumnDisabled]=\"!options().resizableColumns\">\r\n                    <div [ngStyle]=\"{ 'color': col.textColor ? col.textColor : null }\">\r\n                        {{ col.libelle }}\r\n                    </div>\r\n                </th>\r\n                }\r\n                }\r\n            </tr>\r\n        </ng-template>\r\n        <ng-template #body let-rowNode let-rowData=\"rowData\" let-columns=\"columns\">\r\n            <tr [ttRow]=\"rowNode\"\r\n                [ngStyle]=\"{ 'background-color': rowData.color ? rowData.color : null }\">\r\n                @for (col of columns; track col.id) {\r\n                @if (!col.invisible) {\r\n                <td [ngStyle]=\"{\r\n                        'width' : col.width ? col.width : null,\r\n                        'background-color' : rowData[col.id].color ? rowData[col.id].color : null,\r\n                        'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n                    }\"\r\n                    [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n                    [tooltipDisabled]=\"!col.tooltip\"\r\n                    [ttContextMenuRow]=\"options().contextMenuParCellule ? rowData[col.id] : rowData\"\r\n                    [ttContextMenuRowDisabled]=\"options().contextMenuItems == null || col.contextMenuDisabled\"\r\n                    tooltipPosition=\"bottom\"\r\n                    [ngClass]=\"{\r\n                        'paddingCell': rowData[col.id] != null,\r\n                        '!text-left': col.position == 'left' || col.position == null,\r\n                        '!text-right': col.position == 'right',\r\n                        '!text-center': col.position == 'center',\r\n                        '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n                        '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n                    }\">\r\n                    <div class=\"p-column-title\">\r\n                        {{ col.libelle }} :\r\n                    </div>\r\n\r\n                    @if (rowData[col.id]) {\r\n                    <div style=\"white-space: pre;\">\r\n                        {{ rowData[col.id].value }}\r\n                    </div>\r\n                    }\r\n                </td>\r\n                }\r\n                }\r\n            </tr>\r\n        </ng-template>\r\n    </p-treetable>\r\n\r\n</div>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .p-toggleswitch.p-toggleswitch-checked.p-disabled .p-toggleswitch-slider{background:#abd9ba!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th div{color:#fff}:host ::ng-deep .grid_brown .rowHeader>th i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover{background-color:#a47767}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight div{color:#76c7ff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#76c7ff}:host ::ng-deep .grid_brown .rowFilter th{background-color:#795548}:host ::ng-deep .grid_grey .rowHeader>th{background-color:#dedddd}:host ::ng-deep .grid_grey .rowHeader>th div{color:#495057}:host ::ng-deep .grid_grey .rowHeader>th i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover{background-color:#e7e7e7}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight div{color:#008bff}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#008bff}:host ::ng-deep .grid_grey .rowFilter th{background-color:#dedddd}:host ::ng-deep .selectable_cell:hover{background:#dcdcdc!important;cursor:pointer!important}:host ::ng-deep .p-frozen-column{z-index:2!important}:host ::ng-deep .p-treetable-thead{z-index:3!important}:host ::ng-deep .p-checkbox{border-radius:inherit!important}:host ::ng-deep table{table-layout:fixed}:host ::ng-deep p-inputnumber{width:100%}:host ::ng-deep .p-calendar,:host ::ng-deep .p-inputtext,:host ::ng-deep .p-inputnumber,:host ::ng-deep .p-inputnumber-input,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .suffixe,:host ::ng-deep .prefixe{height:25px;padding-top:1px!important}:host ::ng-deep .p-multiselect-label-container,:host ::ng-deep .p-dropdown-label{width:1px!important}:host ::ng-deep .p-scroller-content{min-height:50%}:host ::ng-deep .rowTotal>th{background-color:#edcbaa!important}:host ::ng-deep .rowGrouping{background:#faeada!important}:host ::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider{background:#30e130}:host ::ng-deep .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider{background:#2bd12b}:host ::ng-deep .p-treetable-table{table-layout:fixed}:host ::ng-deep .p-treetable-thead>tr>th{border:1px solid #BF9D8F!important;padding:8px;font-weight:600;height:40px}:host ::ng-deep .headerAffichageSimple div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .headerAffichageEntier{word-wrap:break-word}:host ::ng-deep .p-treetable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-treetable-tbody>tr>td div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-tag{max-width:100%}:host ::ng-deep .p-tag .p-tag-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-button{padding:5px;max-width:100%}:host ::ng-deep .p-button .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .text_bold{font-weight:700!important}:host ::ng-deep .cellDelete{flex:0 0 50px!important;width:50px;text-align:center!important;padding:0!important}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-skeleton{background-color:#dee2e6;border-radius:6px;padding:0}:host ::ng-deep .p-treetable-tbody>tr{height:35px!important}:host ::ng-deep .p-inputtext{height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-editable-column{padding:3px 10px!important}:host ::ng-deep .paddingCell{padding:3px 10px!important}:host ::ng-deep .p-selectbutton>.p-button{width:50%;height:25px}:host ::ng-deep .p-inputgroup>.p-button{height:25px}:host ::ng-deep .buttonDelete{width:100%;height:20px}:host ::ng-deep .p-column-title{display:none}:host ::ng-deep .p-treetable-loading-icon{color:#fff}:host ::ng-deep .cellNotFrozen{position:relative!important}:host ::ng-deep td:not(.cellNotFrozen){z-index:5000!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TreeTableModule }, { kind: "component", type: i2$1.TreeTable, selector: "p-treeTable, p-treetable, p-tree-table", inputs: ["columns", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "paginatorLocale", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "value", "virtualRowHeight", "selectionKeys", "showGridlines"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel", "selectionKeysChange"] }, { kind: "directive", type: i2$1.TTResizableColumn, selector: "[ttResizableColumn]", inputs: ["ttResizableColumnDisabled"] }, { kind: "directive", type: i2$1.TTRow, selector: "[ttRow]", inputs: ["ttRow"] }, { kind: "directive", type: i2$1.TTContextMenuRow, selector: "[ttContextMenuRow]", inputs: ["ttContextMenuRow", "ttContextMenuRowDisabled"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: CilogTreetableComponent, isStandalone: true, selector: "cilog-treetable", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: true, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columns: "columnsChange", values: "valuesChange" }, ngImport: i0, template: "<div class=\"!relative\"\r\n     [ngStyle]=\"{ 'height': options().scrollHeight != null ? options().scrollHeight : '100%' }\">\r\n    \r\n    <p-treetable #table\r\n                 [columns]=\"optimizedColumns()\"\r\n                 [value]=\"values()\"\r\n                 dataKey=\"key\"\r\n                 filterBy=\"key\"\r\n                 [scrollable]=\"true\"\r\n                 [scrollHeight]=\"'flex'\"\r\n                 [loading]=\"loading()\"\r\n                 [tableStyleClass]=\"!options().themeGrille ? 'grid_grey' : options().themeGrille\"\r\n                 [resizableColumns]=\"options().resizableColumns\"\r\n                 columnResizeMode=\"expand\">\r\n        <ng-template #colgroup let-columns>\r\n            <colgroup>\r\n                @for (col of columns; track col.id) {\r\n                <col />\r\n                }\r\n            </colgroup>\r\n        </ng-template>\r\n        <ng-template #header let-columns>\r\n            <tr class=\"rowHeader\">\r\n                @for (col of columns; track col.id) {\r\n                @if (!col.invisible) {\r\n                <th [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': col.backgroundColor ? col.backgroundColor : null }\"\r\n                    [ngClass]=\"{ '!text-center' : options().centerHeaders, 'headerAffichageSimple': !options().headersAffichageEntier, 'headerAffichageEntier': options().headersAffichageEntier }\"\r\n                    id=\"{{ col.id }}\"\r\n                    [pTooltip]=\"col.libelle\"\r\n                    [tooltipDisabled]=\"!col.tooltipHeader\"\r\n                    tooltipPosition=\"bottom\"\r\n                    ttResizableColumn\r\n                    [ttResizableColumnDisabled]=\"!options().resizableColumns\">\r\n                    <div [ngStyle]=\"{ 'color': col.textColor ? col.textColor : null }\">\r\n                        {{ col.libelle }}\r\n                    </div>\r\n                </th>\r\n                }\r\n                }\r\n            </tr>\r\n        </ng-template>\r\n        <ng-template #body let-rowNode let-rowData=\"rowData\" let-columns=\"columns\">\r\n            <tr [ttRow]=\"rowNode\"\r\n                [ngStyle]=\"{ 'background-color': rowData.color ? rowData.color : null }\">\r\n                @for (col of columns; track col.id) {\r\n                @if (!col.invisible) {\r\n                <td [ngStyle]=\"{\r\n                        'width' : col.width ? col.width : null,\r\n                        'background-color' : rowData[col.id].color ? rowData[col.id].color : null,\r\n                        'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n                    }\"\r\n                    [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n                    [tooltipDisabled]=\"!col.tooltip\"\r\n                    [ttContextMenuRow]=\"options().contextMenuParCellule ? rowData[col.id] : rowData\"\r\n                    [ttContextMenuRowDisabled]=\"options().contextMenuItems == null || col.contextMenuDisabled\"\r\n                    tooltipPosition=\"bottom\"\r\n                    [ngClass]=\"{\r\n                        'paddingCell': rowData[col.id] != null,\r\n                        '!text-left': col.position == 'left' || col.position == null,\r\n                        '!text-right': col.position == 'right',\r\n                        '!text-center': col.position == 'center',\r\n                        '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n                        '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n                    }\">\r\n                    <div class=\"p-column-title\">\r\n                        {{ col.libelle }} :\r\n                    </div>\r\n\r\n                    @if (rowData[col.id]) {\r\n                    <div style=\"white-space: pre;\">\r\n                        {{ rowData[col.id].value }}\r\n                    </div>\r\n                    }\r\n                </td>\r\n                }\r\n                }\r\n            </tr>\r\n        </ng-template>\r\n    </p-treetable>\r\n\r\n</div>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .p-toggleswitch.p-toggleswitch-checked.p-disabled .p-toggleswitch-slider{background:#abd9ba!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th div{color:#fff}:host ::ng-deep .grid_brown .rowHeader>th i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover{background-color:#a47767}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight div{color:#76c7ff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#76c7ff}:host ::ng-deep .grid_brown .rowFilter th{background-color:#795548}:host ::ng-deep .grid_grey .rowHeader>th{background-color:#dedddd}:host ::ng-deep .grid_grey .rowHeader>th div{color:#495057}:host ::ng-deep .grid_grey .rowHeader>th i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover{background-color:#e7e7e7}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight div{color:#008bff}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#008bff}:host ::ng-deep .grid_grey .rowFilter th{background-color:#dedddd}:host ::ng-deep .selectable_cell:hover{background:#dcdcdc!important;cursor:pointer!important}:host ::ng-deep .p-frozen-column{z-index:2!important}:host ::ng-deep .p-treetable-thead{z-index:3!important}:host ::ng-deep .p-checkbox{border-radius:inherit!important}:host ::ng-deep table{table-layout:fixed}:host ::ng-deep p-inputnumber{width:100%}:host ::ng-deep .p-calendar,:host ::ng-deep .p-inputtext,:host ::ng-deep .p-inputnumber,:host ::ng-deep .p-inputnumber-input,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .suffixe,:host ::ng-deep .prefixe{height:25px;padding-top:1px!important}:host ::ng-deep .p-multiselect-label-container,:host ::ng-deep .p-dropdown-label{width:1px!important}:host ::ng-deep .p-scroller-content{min-height:50%}:host ::ng-deep .rowTotal>th{background-color:#edcbaa!important}:host ::ng-deep .rowGrouping{background:#faeada!important}:host ::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider{background:#30e130}:host ::ng-deep .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider{background:#2bd12b}:host ::ng-deep .p-treetable-table{table-layout:fixed}:host ::ng-deep .p-treetable-thead>tr>th{border:1px solid #BF9D8F!important;padding:8px;font-weight:600;height:40px}:host ::ng-deep .headerAffichageSimple div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .headerAffichageEntier{word-wrap:break-word}:host ::ng-deep .p-treetable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-treetable-tbody>tr>td div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-tag{max-width:100%}:host ::ng-deep .p-tag .p-tag-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-button{padding:5px;max-width:100%}:host ::ng-deep .p-button .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .text_bold{font-weight:700!important}:host ::ng-deep .cellDelete{flex:0 0 50px!important;width:50px;text-align:center!important;padding:0!important}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-skeleton{background-color:#dee2e6;border-radius:6px;padding:0}:host ::ng-deep .p-treetable-tbody>tr{height:35px!important}:host ::ng-deep .p-inputtext{height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-editable-column{padding:3px 10px!important}:host ::ng-deep .paddingCell{padding:3px 10px!important}:host ::ng-deep .p-selectbutton>.p-button{width:50%;height:25px}:host ::ng-deep .p-inputgroup>.p-button{height:25px}:host ::ng-deep .buttonDelete{width:100%;height:20px}:host ::ng-deep .p-column-title{display:none}:host ::ng-deep .p-treetable-loading-icon{color:#fff}:host ::ng-deep .cellNotFrozen{position:relative!important}:host ::ng-deep td:not(.cellNotFrozen){z-index:5000!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TreeTableModule }, { kind: "component", type: i2$2.TreeTable, selector: "p-treeTable, p-treetable, p-tree-table", inputs: ["columns", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "paginatorLocale", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "value", "virtualRowHeight", "selectionKeys", "showGridlines"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel", "selectionKeysChange"] }, { kind: "directive", type: i2$2.TTResizableColumn, selector: "[ttResizableColumn]", inputs: ["ttResizableColumnDisabled"] }, { kind: "directive", type: i2$2.TTRow, selector: "[ttRow]", inputs: ["ttRow"] }, { kind: "directive", type: i2$2.TTContextMenuRow, selector: "[ttContextMenuRow]", inputs: ["ttContextMenuRow", "ttContextMenuRowDisabled"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CilogTreetableComponent, decorators: [{
             type: Component,
@@ -2063,7 +2051,7 @@ class CilogEditorComponent {
         // NOTHING
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CilogEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: CilogEditorComponent, isStandalone: true, selector: "cilog-editor", inputs: { text: "text" }, outputs: { textChange: "textChange", onTextChange: "onTextChange" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], ngImport: i0, template: "<p-editor #editor\r\n          [(ngModel)]=\"text\"\r\n          (onTextChange)=\"change($event)\">\r\n</p-editor>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i2$2.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange", "onEditorChange", "onFocus", "onBlur"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: CilogEditorComponent, isStandalone: true, selector: "cilog-editor", inputs: { text: "text" }, outputs: { textChange: "textChange", onTextChange: "onTextChange" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], ngImport: i0, template: "<p-editor #editor\r\n          [(ngModel)]=\"text\"\r\n          (onTextChange)=\"change($event)\">\r\n</p-editor>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i2$3.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange", "onEditorChange", "onFocus", "onBlur"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: CilogEditorComponent, decorators: [{
             type: Component,
@@ -2278,7 +2266,7 @@ class DocumentationContextuelleComponent {
             return urlKey.includes(docKey) || docKey.includes(urlKey);
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DocumentationContextuelleComponent, deps: [{ token: i1$3.HttpClient }, { token: i2$3.Router }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DocumentationContextuelleComponent, deps: [{ token: i1$3.HttpClient }, { token: i2$4.Router }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: DocumentationContextuelleComponent, isStandalone: true, selector: "cilog-documentation-contextuelle", providers: [provideMarkdown()], ngImport: i0, template: "<div class=\"documentation-container\">\r\n    <!-- Menu sup\u00E9rieur -->\r\n    <div class=\"documentation-menu\">\r\n        <button pButton\r\n                type=\"button\"\r\n                icon=\"pi pi-list\"\r\n                label=\"Sommaire des documentations\"\r\n                class=\"p-button-sm p-button-outlined\"\r\n                (click)=\"openDocumentationList()\"\r\n                title=\"Voir toutes les documentations disponibles\">\r\n        </button>\r\n        <button pButton\r\n                type=\"button\"\r\n                icon=\"pi pi-home\"\r\n                label=\"Documentation courante\"\r\n                class=\"p-button-sm p-button-outlined\"\r\n                (click)=\"openCurrentPageDoc()\"\r\n                title=\"Documentation de la page actuelle\">\r\n        </button>\r\n    </div>\r\n\r\n    <!-- Syst\u00E8me d'onglets -->\r\n    <p-tabs [(value)]=\"activeTabValue\"\r\n            (onClose)=\"closeTab($event)\"\r\n            styleClass=\"documentation-tabs\">\r\n        <p-tablist>\r\n            @for (tab of tabs; track tab.value) {\r\n            <p-tab [value]=\"tab.value\">{{ tab.title }}</p-tab>\r\n            }\r\n        </p-tablist>\r\n        <p-tabpanels>\r\n            @for (tab of tabs; track tab.value; let i = $index) {\r\n            <p-tabpanel [value]=\"tab.value\">\r\n                <!-- Contenu pour onglet de liste - Version am\u00E9lior\u00E9e -->\r\n                @if (tab.type === 'list') {\r\n                <div class=\"docs-list-container\">\r\n                    <div class=\"docs-header\">\r\n                        <h2>\uD83D\uDCDA Sommaire de la Documentation</h2>\r\n                        <p class=\"docs-subtitle\">Explorez toutes les fonctionnalit\u00E9s disponibles dans LogeProj</p>\r\n                    </div>\r\n                    <!-- Barre de recherche -->\r\n                    <div class=\"search-bar\">\r\n                        <span class=\"p-input-icon-left\" style=\"width: 100%; max-width: 800px;\">\r\n                            <i class=\"pi pi-search\"></i>\r\n                            <input type=\"text\"\r\n                                   pInputText\r\n                                   placeholder=\"Rechercher dans les documentations...\"\r\n                                   name=\"recherche\"\r\n                                   [(ngModel)]=\"searchQuery\"\r\n                                   ngDefaultControl\r\n                                   (input)=\"filterDocumentation()\"\r\n                                   style=\"width: 100% !important; padding: 12px 20px 12px 40px !important; border-radius: 25px !important;\">\r\n                        </span>\r\n                    </div>\r\n                    <!-- Liste des cat\u00E9gories -->\r\n                    <div class=\"categories-container\">\r\n                        @for (category of filteredCategories; track category.key) {\r\n                        <div class=\"category-section\">\r\n                            <div class=\"category-header\" (click)=\"toggleCategory(category.key)\">\r\n                                <i class=\"pi\" [ngClass]=\"category.expanded ? 'pi-chevron-down' : 'pi-chevron-right'\"></i>\r\n                                <span class=\"category-icon\">{{ category.icon }}</span>\r\n                                <h3 class=\"category-title\">{{ category.name }}</h3>\r\n                                <span class=\"category-count\">({{ category.docs.length }})</span>\r\n                            </div>\r\n                            <div class=\"category-content\" [ngClass]=\"{ 'expanded': category.expanded }\">\r\n                                <div class=\"docs-grid\">\r\n                                    @for (doc of category.docs; track doc.fileName) {\r\n                                    <div class=\"doc-card\"\r\n                                         (click)=\"openDocumentationAndSwitch(doc)\"\r\n                                         [title]=\"doc.description\">\r\n                                        <div class=\"doc-card-content\">\r\n                                            <h4 class=\"doc-name\">{{ doc.displayName }}</h4>\r\n                                            <markdown class=\"doc-description\" [data]=\"doc.description\"\r\n                                                      (click)=\"onMarkdownClick($event)\"></markdown>\r\n                                        </div>\r\n                                    </div>\r\n                                    }\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        }\r\n                    </div>\r\n                    <!-- Stats en bas -->\r\n                    <div class=\"docs-stats\">\r\n                        <div class=\"stat-item\">\r\n                            <strong>{{ getTotalDocsCount() }}</strong> documentations disponibles\r\n                        </div>\r\n                        <div class=\"stat-item\">\r\n                            <strong>{{ getOpenTabsCount() }}</strong> onglets ouverts\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                }\r\n                <!-- Contenu pour onglet de documentation -->\r\n                @if (tab.type === 'doc') {\r\n                <div class=\"markdown-container\">\r\n                    <!-- Breadcrumb pour navigation -->\r\n                    @if (tab.category) {\r\n                    <div class=\"doc-breadcrumb\">\r\n                        <span class=\"breadcrumb-item\">{{ tab.category }}</span>\r\n                        <i class=\"pi pi-angle-right\"></i>\r\n                        <span class=\"breadcrumb-current\">{{ tab.title }}</span>\r\n                    </div>\r\n                    }\r\n                    @if (tab.loading) {\r\n                    <div class=\"loading-container\">\r\n                        <p-progressSpinner strokeWidth=\"4\"></p-progressSpinner>\r\n                        <span>Chargement de la documentation...</span>\r\n                    </div>\r\n                    }\r\n                    @if (!tab.loading) {\r\n                    <markdown [data]=\"tab.content || 'Aucun contenu disponible'\"\r\n                              (click)=\"onMarkdownClick($event)\">\r\n                    </markdown>\r\n                    }\r\n                </div>\r\n                }\r\n            </p-tabpanel>\r\n            }\r\n        </p-tabpanels>\r\n    </p-tabs>\r\n</div>\r\n", styles: [".documentation-container{display:flex;flex-direction:column;height:100%;width:100%}.documentation-menu{padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e9ecef;display:flex;gap:10px;flex-shrink:0}.documentation-menu .p-button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}.documentation-menu .p-button:hover{background:#ffffff4d}.docs-list-container{padding:20px;flex:1;overflow-y:auto;background:#f8f9fa}.docs-header{text-align:center;margin-bottom:30px}.docs-header h2{margin:0 0 10px;color:#2c3e50;font-size:2rem}.docs-header .docs-subtitle{color:#7f8c8d;font-size:1.1rem;margin:0}.search-bar{margin-bottom:30px;display:flex;justify-content:center}.search-bar .search-input{width:100%;padding:12px 20px 12px 40px;border-radius:25px;border:2px solid #e9ecef;font-size:1rem}.search-bar .search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.categories-container{max-width:1200px;margin:0 auto}.category-section{margin-bottom:25px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.category-section .category-header{padding:20px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);cursor:pointer;display:flex;align-items:center;gap:15px;transition:all .3s ease}.category-section .category-header:hover{background:linear-gradient(135deg,#e8eaf6,#b39ddb)}.category-section .category-header .pi{color:#667eea;font-size:1rem;transition:transform .3s ease}.category-section .category-header .category-icon{font-size:1.5rem}.category-section .category-header .category-title{margin:0;color:#2c3e50;font-size:1.3rem;flex:1}.category-section .category-header .category-count{color:#7f8c8d;font-size:.9rem;background:#677eea1a;padding:4px 12px;border-radius:15px}.category-section .category-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out}.category-section .category-content.expanded{max-height:2000px;transition:max-height .6s ease-in}.docs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:25px}.doc-card{border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;background:#fff;position:relative;overflow:hidden}.doc-card:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .3s ease}.doc-card:hover{border-color:#667eea;box-shadow:0 8px 25px #667eea26;transform:translateY(-4px)}.doc-card:hover:before{transform:scaleX(1)}.doc-card .doc-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.doc-card .doc-card-header .doc-icon{font-size:2rem}.doc-card .doc-card-header .doc-badge{padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.doc-card .doc-card-header .doc-badge.doc-badge-high{background:#e8f5e8;color:#2e7d2e}.doc-card .doc-card-header .doc-badge.doc-badge-medium{background:#fff3cd;color:#856404}.doc-card .doc-card-header .doc-badge.doc-badge-low{background:#f8f9fa;color:#6c757d}.doc-card .doc-card-content .doc-name{margin:0 0 10px;color:#2c3e50;font-size:1.1rem;font-weight:600;line-height:1.3}.doc-card .doc-card-content .doc-description{color:#6c757d;font-size:.9rem;line-height:1.4;margin:0 0 10px}.doc-card .doc-card-content .doc-description ::ng-deep p{margin:0;display:inline}.doc-card .doc-card-content .doc-description ::ng-deep a{color:#667eea;text-decoration:none;pointer-events:auto}.doc-card .doc-card-content .doc-description ::ng-deep a:hover{text-decoration:underline}.doc-card .doc-card-content .doc-filename{color:#adb5bd;font-size:.8rem;font-family:Courier New,monospace}.docs-stats{display:flex;justify-content:center;gap:40px;margin-top:40px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.docs-stats .stat-item{text-align:center;color:#6c757d}.docs-stats .stat-item strong{color:#667eea;font-size:1.2rem}.markdown-container{flex:1;overflow-y:auto;padding:20px;background:#fff}.markdown-container .doc-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding:10px 0;border-bottom:1px solid #e9ecef;color:#6c757d;font-size:.9rem}.markdown-container .doc-breadcrumb .breadcrumb-current{color:#2c3e50;font-weight:600}.markdown-container markdown{display:block;line-height:1.6}.markdown-container markdown ::ng-deep a[href$=\".md\"]{color:#667eea;text-decoration:none;cursor:pointer;border-bottom:1px dashed #667eea}.markdown-container markdown ::ng-deep a[href$=\".md\"]:hover{text-decoration:none;border-bottom-style:solid}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;color:#6c757d;gap:20px}.loading-container span{font-size:1.1rem}.documentation-tabs{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-panels{flex:1;display:flex}.documentation-tabs ::ng-deep .p-tabview-panels .p-tabview-panel{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-nav{background:#f8f9fa;border-bottom:2px solid #e9ecef}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link{background:transparent;border:none;color:#6c757d;font-weight:500}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link:not(.p-disabled):focus{box-shadow:0 0 0 2px #667eea33}.documentation-tabs ::ng-deep .p-tabview-nav .p-highlight .p-tabview-nav-link{background:#fff;color:#667eea;border-bottom:2px solid #667eea}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i5$1.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i6$1.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i6$1.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i6$1.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i6$1.TabList, selector: "p-tablist" }, { kind: "component", type: i6$1.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: DocumentationContextuelleComponent, decorators: [{
@@ -2291,7 +2279,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                         EditorModule,
                         MarkdownComponent
                     ], template: "<div class=\"documentation-container\">\r\n    <!-- Menu sup\u00E9rieur -->\r\n    <div class=\"documentation-menu\">\r\n        <button pButton\r\n                type=\"button\"\r\n                icon=\"pi pi-list\"\r\n                label=\"Sommaire des documentations\"\r\n                class=\"p-button-sm p-button-outlined\"\r\n                (click)=\"openDocumentationList()\"\r\n                title=\"Voir toutes les documentations disponibles\">\r\n        </button>\r\n        <button pButton\r\n                type=\"button\"\r\n                icon=\"pi pi-home\"\r\n                label=\"Documentation courante\"\r\n                class=\"p-button-sm p-button-outlined\"\r\n                (click)=\"openCurrentPageDoc()\"\r\n                title=\"Documentation de la page actuelle\">\r\n        </button>\r\n    </div>\r\n\r\n    <!-- Syst\u00E8me d'onglets -->\r\n    <p-tabs [(value)]=\"activeTabValue\"\r\n            (onClose)=\"closeTab($event)\"\r\n            styleClass=\"documentation-tabs\">\r\n        <p-tablist>\r\n            @for (tab of tabs; track tab.value) {\r\n            <p-tab [value]=\"tab.value\">{{ tab.title }}</p-tab>\r\n            }\r\n        </p-tablist>\r\n        <p-tabpanels>\r\n            @for (tab of tabs; track tab.value; let i = $index) {\r\n            <p-tabpanel [value]=\"tab.value\">\r\n                <!-- Contenu pour onglet de liste - Version am\u00E9lior\u00E9e -->\r\n                @if (tab.type === 'list') {\r\n                <div class=\"docs-list-container\">\r\n                    <div class=\"docs-header\">\r\n                        <h2>\uD83D\uDCDA Sommaire de la Documentation</h2>\r\n                        <p class=\"docs-subtitle\">Explorez toutes les fonctionnalit\u00E9s disponibles dans LogeProj</p>\r\n                    </div>\r\n                    <!-- Barre de recherche -->\r\n                    <div class=\"search-bar\">\r\n                        <span class=\"p-input-icon-left\" style=\"width: 100%; max-width: 800px;\">\r\n                            <i class=\"pi pi-search\"></i>\r\n                            <input type=\"text\"\r\n                                   pInputText\r\n                                   placeholder=\"Rechercher dans les documentations...\"\r\n                                   name=\"recherche\"\r\n                                   [(ngModel)]=\"searchQuery\"\r\n                                   ngDefaultControl\r\n                                   (input)=\"filterDocumentation()\"\r\n                                   style=\"width: 100% !important; padding: 12px 20px 12px 40px !important; border-radius: 25px !important;\">\r\n                        </span>\r\n                    </div>\r\n                    <!-- Liste des cat\u00E9gories -->\r\n                    <div class=\"categories-container\">\r\n                        @for (category of filteredCategories; track category.key) {\r\n                        <div class=\"category-section\">\r\n                            <div class=\"category-header\" (click)=\"toggleCategory(category.key)\">\r\n                                <i class=\"pi\" [ngClass]=\"category.expanded ? 'pi-chevron-down' : 'pi-chevron-right'\"></i>\r\n                                <span class=\"category-icon\">{{ category.icon }}</span>\r\n                                <h3 class=\"category-title\">{{ category.name }}</h3>\r\n                                <span class=\"category-count\">({{ category.docs.length }})</span>\r\n                            </div>\r\n                            <div class=\"category-content\" [ngClass]=\"{ 'expanded': category.expanded }\">\r\n                                <div class=\"docs-grid\">\r\n                                    @for (doc of category.docs; track doc.fileName) {\r\n                                    <div class=\"doc-card\"\r\n                                         (click)=\"openDocumentationAndSwitch(doc)\"\r\n                                         [title]=\"doc.description\">\r\n                                        <div class=\"doc-card-content\">\r\n                                            <h4 class=\"doc-name\">{{ doc.displayName }}</h4>\r\n                                            <markdown class=\"doc-description\" [data]=\"doc.description\"\r\n                                                      (click)=\"onMarkdownClick($event)\"></markdown>\r\n                                        </div>\r\n                                    </div>\r\n                                    }\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        }\r\n                    </div>\r\n                    <!-- Stats en bas -->\r\n                    <div class=\"docs-stats\">\r\n                        <div class=\"stat-item\">\r\n                            <strong>{{ getTotalDocsCount() }}</strong> documentations disponibles\r\n                        </div>\r\n                        <div class=\"stat-item\">\r\n                            <strong>{{ getOpenTabsCount() }}</strong> onglets ouverts\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                }\r\n                <!-- Contenu pour onglet de documentation -->\r\n                @if (tab.type === 'doc') {\r\n                <div class=\"markdown-container\">\r\n                    <!-- Breadcrumb pour navigation -->\r\n                    @if (tab.category) {\r\n                    <div class=\"doc-breadcrumb\">\r\n                        <span class=\"breadcrumb-item\">{{ tab.category }}</span>\r\n                        <i class=\"pi pi-angle-right\"></i>\r\n                        <span class=\"breadcrumb-current\">{{ tab.title }}</span>\r\n                    </div>\r\n                    }\r\n                    @if (tab.loading) {\r\n                    <div class=\"loading-container\">\r\n                        <p-progressSpinner strokeWidth=\"4\"></p-progressSpinner>\r\n                        <span>Chargement de la documentation...</span>\r\n                    </div>\r\n                    }\r\n                    @if (!tab.loading) {\r\n                    <markdown [data]=\"tab.content || 'Aucun contenu disponible'\"\r\n                              (click)=\"onMarkdownClick($event)\">\r\n                    </markdown>\r\n                    }\r\n                </div>\r\n                }\r\n            </p-tabpanel>\r\n            }\r\n        </p-tabpanels>\r\n    </p-tabs>\r\n</div>\r\n", styles: [".documentation-container{display:flex;flex-direction:column;height:100%;width:100%}.documentation-menu{padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e9ecef;display:flex;gap:10px;flex-shrink:0}.documentation-menu .p-button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}.documentation-menu .p-button:hover{background:#ffffff4d}.docs-list-container{padding:20px;flex:1;overflow-y:auto;background:#f8f9fa}.docs-header{text-align:center;margin-bottom:30px}.docs-header h2{margin:0 0 10px;color:#2c3e50;font-size:2rem}.docs-header .docs-subtitle{color:#7f8c8d;font-size:1.1rem;margin:0}.search-bar{margin-bottom:30px;display:flex;justify-content:center}.search-bar .search-input{width:100%;padding:12px 20px 12px 40px;border-radius:25px;border:2px solid #e9ecef;font-size:1rem}.search-bar .search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.categories-container{max-width:1200px;margin:0 auto}.category-section{margin-bottom:25px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.category-section .category-header{padding:20px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);cursor:pointer;display:flex;align-items:center;gap:15px;transition:all .3s ease}.category-section .category-header:hover{background:linear-gradient(135deg,#e8eaf6,#b39ddb)}.category-section .category-header .pi{color:#667eea;font-size:1rem;transition:transform .3s ease}.category-section .category-header .category-icon{font-size:1.5rem}.category-section .category-header .category-title{margin:0;color:#2c3e50;font-size:1.3rem;flex:1}.category-section .category-header .category-count{color:#7f8c8d;font-size:.9rem;background:#677eea1a;padding:4px 12px;border-radius:15px}.category-section .category-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out}.category-section .category-content.expanded{max-height:2000px;transition:max-height .6s ease-in}.docs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:25px}.doc-card{border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;background:#fff;position:relative;overflow:hidden}.doc-card:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .3s ease}.doc-card:hover{border-color:#667eea;box-shadow:0 8px 25px #667eea26;transform:translateY(-4px)}.doc-card:hover:before{transform:scaleX(1)}.doc-card .doc-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.doc-card .doc-card-header .doc-icon{font-size:2rem}.doc-card .doc-card-header .doc-badge{padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.doc-card .doc-card-header .doc-badge.doc-badge-high{background:#e8f5e8;color:#2e7d2e}.doc-card .doc-card-header .doc-badge.doc-badge-medium{background:#fff3cd;color:#856404}.doc-card .doc-card-header .doc-badge.doc-badge-low{background:#f8f9fa;color:#6c757d}.doc-card .doc-card-content .doc-name{margin:0 0 10px;color:#2c3e50;font-size:1.1rem;font-weight:600;line-height:1.3}.doc-card .doc-card-content .doc-description{color:#6c757d;font-size:.9rem;line-height:1.4;margin:0 0 10px}.doc-card .doc-card-content .doc-description ::ng-deep p{margin:0;display:inline}.doc-card .doc-card-content .doc-description ::ng-deep a{color:#667eea;text-decoration:none;pointer-events:auto}.doc-card .doc-card-content .doc-description ::ng-deep a:hover{text-decoration:underline}.doc-card .doc-card-content .doc-filename{color:#adb5bd;font-size:.8rem;font-family:Courier New,monospace}.docs-stats{display:flex;justify-content:center;gap:40px;margin-top:40px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.docs-stats .stat-item{text-align:center;color:#6c757d}.docs-stats .stat-item strong{color:#667eea;font-size:1.2rem}.markdown-container{flex:1;overflow-y:auto;padding:20px;background:#fff}.markdown-container .doc-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding:10px 0;border-bottom:1px solid #e9ecef;color:#6c757d;font-size:.9rem}.markdown-container .doc-breadcrumb .breadcrumb-current{color:#2c3e50;font-weight:600}.markdown-container markdown{display:block;line-height:1.6}.markdown-container markdown ::ng-deep a[href$=\".md\"]{color:#667eea;text-decoration:none;cursor:pointer;border-bottom:1px dashed #667eea}.markdown-container markdown ::ng-deep a[href$=\".md\"]:hover{text-decoration:none;border-bottom-style:solid}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;color:#6c757d;gap:20px}.loading-container span{font-size:1.1rem}.documentation-tabs{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-panels{flex:1;display:flex}.documentation-tabs ::ng-deep .p-tabview-panels .p-tabview-panel{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-nav{background:#f8f9fa;border-bottom:2px solid #e9ecef}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link{background:transparent;border:none;color:#6c757d;font-weight:500}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link:not(.p-disabled):focus{box-shadow:0 0 0 2px #667eea33}.documentation-tabs ::ng-deep .p-tabview-nav .p-highlight .p-tabview-nav-link{background:#fff;color:#667eea;border-bottom:2px solid #667eea}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: i2$3.Router }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }] });
+        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: i2$4.Router }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }] });
 
 class CilogLibService {
     constructor() { }