@kksdev/ds-angular 1.7.0 → 1.7.2

package/fesm2022/kksdev-ds-angular.mjs

@@ -2254,11 +2254,11 @@ class PrimitiveToggle {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: PrimitiveToggle, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: PrimitiveToggle, isStandalone: true, selector: "primitive-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, toggleId: { classPropertyName: "toggleId", publicName: "toggleId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", checkedChange: "checkedChange" }, ngImport: i0, template: "<div [ngClass]=\"cssClasses()\">\n  @if (label() && labelPosition() === 'left') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n\n  <div\n    class=\"primitive-toggle__switch\"\n    (click)=\"onToggle()\"\n    (keydown)=\"onKeyDown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    [attr.role]=\"'switch'\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-disabled]=\"disabled()\"\n    [attr.aria-labelledby]=\"label() ? toggleId() + '-label' : null\"\n    [attr.tabindex]=\"disabled() ? -1 : 0\"\n  >\n    <div class=\"primitive-toggle__track\">\n      <div class=\"primitive-toggle__thumb\"></div>\n    </div>\n  </div>\n\n  @if (label() && labelPosition() === 'right') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n</div>\n", styles: [".primitive-toggle{display:inline-flex;align-items:center;gap:var(--space-2)}.primitive-toggle--label-left,.primitive-toggle--label-right{flex-direction:row}.primitive-toggle__switch{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.primitive-toggle--disabled .primitive-toggle__switch{cursor:not-allowed;opacity:.6}.primitive-toggle__track{position:relative;border-radius:var(--toggle-track-radius);background-color:var(--toggle-track-bg);transition:background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__track{width:var(--toggle-width-sm);height:var(--toggle-height-sm)}.primitive-toggle--md .primitive-toggle__track{width:var(--toggle-width-md);height:var(--toggle-height-md)}.primitive-toggle--lg .primitive-toggle__track{width:var(--toggle-width-lg);height:var(--toggle-height-lg)}.primitive-toggle__thumb{position:absolute;top:2px;left:2px;border-radius:50%;background-color:var(--toggle-thumb-bg);box-shadow:var(--toggle-thumb-shadow);transition:transform var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__thumb{width:var(--toggle-thumb-size-sm);height:var(--toggle-thumb-size-sm)}.primitive-toggle--md .primitive-toggle__thumb{width:var(--toggle-thumb-size-md);height:var(--toggle-thumb-size-md)}.primitive-toggle--lg .primitive-toggle__thumb{width:var(--toggle-thumb-size-lg);height:var(--toggle-thumb-size-lg)}.primitive-toggle__label{font-size:var(--font-size-3);color:var(--text-default);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--duration-fast) var(--easing-default)}.primitive-toggle__label--disabled{color:var(--text-disabled);cursor:not-allowed}.primitive-toggle--checked .primitive-toggle__track{background-color:var(--toggle-track-checked-bg)}.primitive-toggle--sm .primitive-toggle--checked .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-sm) - var(--toggle-thumb-size-sm) - 4px))}.primitive-toggle--md .primitive-toggle--checked .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-md) - var(--toggle-thumb-size-md) - 4px))}.primitive-toggle--lg .primitive-toggle--checked .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-lg) - var(--toggle-thumb-size-lg) - 4px))}.primitive-toggle:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-bg)}.primitive-toggle--checked:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-checked-bg)}.primitive-toggle--focused .primitive-toggle__track{box-shadow:var(--toggle-focus-ring)}.primitive-toggle--disabled .primitive-toggle__track{background-color:var(--toggle-disabled-track-bg)}.primitive-toggle--disabled .primitive-toggle__thumb{background-color:var(--toggle-disabled-thumb-bg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: PrimitiveToggle, isStandalone: true, selector: "primitive-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, toggleId: { classPropertyName: "toggleId", publicName: "toggleId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", checkedChange: "checkedChange" }, ngImport: i0, template: "<div [ngClass]=\"cssClasses()\">\n  @if (label() && labelPosition() === 'left') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n\n  <div\n    class=\"primitive-toggle__switch\"\n    (click)=\"onToggle()\"\n    (keydown)=\"onKeyDown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    [attr.role]=\"'switch'\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-disabled]=\"disabled()\"\n    [attr.aria-labelledby]=\"label() ? toggleId() + '-label' : null\"\n    [attr.tabindex]=\"disabled() ? -1 : 0\"\n  >\n    <div class=\"primitive-toggle__track\">\n      <div class=\"primitive-toggle__thumb\"></div>\n    </div>\n  </div>\n\n  @if (label() && labelPosition() === 'right') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n</div>\n", styles: [".primitive-toggle{display:inline-flex;align-items:center;gap:var(--space-2)}.primitive-toggle--label-left,.primitive-toggle--label-right{flex-direction:row}.primitive-toggle__switch{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.primitive-toggle--disabled .primitive-toggle__switch{cursor:not-allowed;opacity:.6}.primitive-toggle__track{position:relative;border-radius:var(--toggle-track-radius);background-color:var(--toggle-track-bg);transition:background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__track{width:var(--toggle-width-sm);height:var(--toggle-height-sm)}.primitive-toggle--md .primitive-toggle__track{width:var(--toggle-width-md);height:var(--toggle-height-md)}.primitive-toggle--lg .primitive-toggle__track{width:var(--toggle-width-lg);height:var(--toggle-height-lg)}.primitive-toggle__thumb{position:absolute;top:2px;left:2px;border-radius:50%;background-color:var(--toggle-thumb-bg);box-shadow:var(--toggle-thumb-shadow);transition:transform var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__thumb{width:var(--toggle-thumb-size-sm);height:var(--toggle-thumb-size-sm)}.primitive-toggle--md .primitive-toggle__thumb{width:var(--toggle-thumb-size-md);height:var(--toggle-thumb-size-md)}.primitive-toggle--lg .primitive-toggle__thumb{width:var(--toggle-thumb-size-lg);height:var(--toggle-thumb-size-lg)}.primitive-toggle__label{font-size:var(--font-size-3);color:var(--text-default);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--duration-fast) var(--easing-default)}.primitive-toggle__label--disabled{color:var(--text-disabled);cursor:not-allowed}.primitive-toggle--checked .primitive-toggle__track{background-color:var(--toggle-track-checked-bg)}.primitive-toggle--checked.primitive-toggle--sm .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-sm) - var(--toggle-thumb-size-sm) - 4px))}.primitive-toggle--checked.primitive-toggle--md .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-md) - var(--toggle-thumb-size-md) - 4px))}.primitive-toggle--checked.primitive-toggle--lg .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-lg) - var(--toggle-thumb-size-lg) - 4px))}.primitive-toggle:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-bg)}.primitive-toggle--checked:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-checked-bg)}.primitive-toggle--focused .primitive-toggle__track{box-shadow:var(--toggle-focus-ring)}.primitive-toggle--disabled .primitive-toggle__track{background-color:var(--toggle-disabled-track-bg)}.primitive-toggle--disabled .primitive-toggle__thumb{background-color:var(--toggle-disabled-thumb-bg)}\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.15", ngImport: i0, type: PrimitiveToggle, decorators: [{
             type: Component,
-            args: [{ selector: 'primitive-toggle', standalone: true, imports: [CommonModule], template: "<div [ngClass]=\"cssClasses()\">\n  @if (label() && labelPosition() === 'left') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n\n  <div\n    class=\"primitive-toggle__switch\"\n    (click)=\"onToggle()\"\n    (keydown)=\"onKeyDown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    [attr.role]=\"'switch'\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-disabled]=\"disabled()\"\n    [attr.aria-labelledby]=\"label() ? toggleId() + '-label' : null\"\n    [attr.tabindex]=\"disabled() ? -1 : 0\"\n  >\n    <div class=\"primitive-toggle__track\">\n      <div class=\"primitive-toggle__thumb\"></div>\n    </div>\n  </div>\n\n  @if (label() && labelPosition() === 'right') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n</div>\n", styles: [".primitive-toggle{display:inline-flex;align-items:center;gap:var(--space-2)}.primitive-toggle--label-left,.primitive-toggle--label-right{flex-direction:row}.primitive-toggle__switch{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.primitive-toggle--disabled .primitive-toggle__switch{cursor:not-allowed;opacity:.6}.primitive-toggle__track{position:relative;border-radius:var(--toggle-track-radius);background-color:var(--toggle-track-bg);transition:background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__track{width:var(--toggle-width-sm);height:var(--toggle-height-sm)}.primitive-toggle--md .primitive-toggle__track{width:var(--toggle-width-md);height:var(--toggle-height-md)}.primitive-toggle--lg .primitive-toggle__track{width:var(--toggle-width-lg);height:var(--toggle-height-lg)}.primitive-toggle__thumb{position:absolute;top:2px;left:2px;border-radius:50%;background-color:var(--toggle-thumb-bg);box-shadow:var(--toggle-thumb-shadow);transition:transform var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__thumb{width:var(--toggle-thumb-size-sm);height:var(--toggle-thumb-size-sm)}.primitive-toggle--md .primitive-toggle__thumb{width:var(--toggle-thumb-size-md);height:var(--toggle-thumb-size-md)}.primitive-toggle--lg .primitive-toggle__thumb{width:var(--toggle-thumb-size-lg);height:var(--toggle-thumb-size-lg)}.primitive-toggle__label{font-size:var(--font-size-3);color:var(--text-default);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--duration-fast) var(--easing-default)}.primitive-toggle__label--disabled{color:var(--text-disabled);cursor:not-allowed}.primitive-toggle--checked .primitive-toggle__track{background-color:var(--toggle-track-checked-bg)}.primitive-toggle--sm .primitive-toggle--checked .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-sm) - var(--toggle-thumb-size-sm) - 4px))}.primitive-toggle--md .primitive-toggle--checked .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-md) - var(--toggle-thumb-size-md) - 4px))}.primitive-toggle--lg .primitive-toggle--checked .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-lg) - var(--toggle-thumb-size-lg) - 4px))}.primitive-toggle:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-bg)}.primitive-toggle--checked:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-checked-bg)}.primitive-toggle--focused .primitive-toggle__track{box-shadow:var(--toggle-focus-ring)}.primitive-toggle--disabled .primitive-toggle__track{background-color:var(--toggle-disabled-track-bg)}.primitive-toggle--disabled .primitive-toggle__thumb{background-color:var(--toggle-disabled-thumb-bg)}\n"] }]
+            args: [{ selector: 'primitive-toggle', standalone: true, imports: [CommonModule], template: "<div [ngClass]=\"cssClasses()\">\n  @if (label() && labelPosition() === 'left') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n\n  <div\n    class=\"primitive-toggle__switch\"\n    (click)=\"onToggle()\"\n    (keydown)=\"onKeyDown($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    [attr.role]=\"'switch'\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-disabled]=\"disabled()\"\n    [attr.aria-labelledby]=\"label() ? toggleId() + '-label' : null\"\n    [attr.tabindex]=\"disabled() ? -1 : 0\"\n  >\n    <div class=\"primitive-toggle__track\">\n      <div class=\"primitive-toggle__thumb\"></div>\n    </div>\n  </div>\n\n  @if (label() && labelPosition() === 'right') {\n    <label\n      [id]=\"toggleId() + '-label'\"\n      class=\"primitive-toggle__label\"\n      [class.primitive-toggle__label--disabled]=\"disabled()\"\n      (click)=\"onToggle()\"\n    >\n      {{ label() }}\n    </label>\n  }\n</div>\n", styles: [".primitive-toggle{display:inline-flex;align-items:center;gap:var(--space-2)}.primitive-toggle--label-left,.primitive-toggle--label-right{flex-direction:row}.primitive-toggle__switch{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.primitive-toggle--disabled .primitive-toggle__switch{cursor:not-allowed;opacity:.6}.primitive-toggle__track{position:relative;border-radius:var(--toggle-track-radius);background-color:var(--toggle-track-bg);transition:background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__track{width:var(--toggle-width-sm);height:var(--toggle-height-sm)}.primitive-toggle--md .primitive-toggle__track{width:var(--toggle-width-md);height:var(--toggle-height-md)}.primitive-toggle--lg .primitive-toggle__track{width:var(--toggle-width-lg);height:var(--toggle-height-lg)}.primitive-toggle__thumb{position:absolute;top:2px;left:2px;border-radius:50%;background-color:var(--toggle-thumb-bg);box-shadow:var(--toggle-thumb-shadow);transition:transform var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),box-shadow var(--duration-fast) var(--easing-default)}.primitive-toggle--sm .primitive-toggle__thumb{width:var(--toggle-thumb-size-sm);height:var(--toggle-thumb-size-sm)}.primitive-toggle--md .primitive-toggle__thumb{width:var(--toggle-thumb-size-md);height:var(--toggle-thumb-size-md)}.primitive-toggle--lg .primitive-toggle__thumb{width:var(--toggle-thumb-size-lg);height:var(--toggle-thumb-size-lg)}.primitive-toggle__label{font-size:var(--font-size-3);color:var(--text-default);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--duration-fast) var(--easing-default)}.primitive-toggle__label--disabled{color:var(--text-disabled);cursor:not-allowed}.primitive-toggle--checked .primitive-toggle__track{background-color:var(--toggle-track-checked-bg)}.primitive-toggle--checked.primitive-toggle--sm .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-sm) - var(--toggle-thumb-size-sm) - 4px))}.primitive-toggle--checked.primitive-toggle--md .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-md) - var(--toggle-thumb-size-md) - 4px))}.primitive-toggle--checked.primitive-toggle--lg .primitive-toggle__thumb{transform:translate(calc(var(--toggle-width-lg) - var(--toggle-thumb-size-lg) - 4px))}.primitive-toggle:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-bg)}.primitive-toggle--checked:hover:not(.primitive-toggle--disabled) .primitive-toggle__track{background-color:var(--toggle-hover-track-checked-bg)}.primitive-toggle--focused .primitive-toggle__track{box-shadow:var(--toggle-focus-ring)}.primitive-toggle--disabled .primitive-toggle__track{background-color:var(--toggle-disabled-track-bg)}.primitive-toggle--disabled .primitive-toggle__thumb{background-color:var(--toggle-disabled-thumb-bg)}\n"] }]
         }], propDecorators: { checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], toggleId: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleId", required: false }] }], checkedChange: [{ type: i0.Output, args: ["checkedChange"] }] } });
 
 /*
@@ -3038,6 +3038,44 @@ const AUTOCOMPLETE_POSITIONS = [
         offsetY: -4,
     },
 ];
+/**
+ * Positions pour popover sidebar (sidebar à gauche → popover à droite)
+ *
+ * Utilise DROPDOWN_POSITIONS_RIGHT existant.
+ * Alias exporté pour clarté sémantique.
+ */
+const SIDEBAR_POPOVER_POSITIONS_RIGHT = DROPDOWN_POSITIONS_RIGHT;
+/**
+ * Positions pour popover sidebar (sidebar à droite → popover à gauche)
+ *
+ * Stratégie :
+ * 1. Position préférée : à gauche, aligné en haut
+ * 2. Fallback : à gauche, aligné au centre
+ * 3. Fallback : à droite si pas d'espace à gauche
+ */
+const SIDEBAR_POPOVER_POSITIONS_LEFT = [
+    {
+        originX: 'start',
+        originY: 'top',
+        overlayX: 'end',
+        overlayY: 'top',
+        offsetX: -6,
+    },
+    {
+        originX: 'start',
+        originY: 'center',
+        overlayX: 'end',
+        overlayY: 'center',
+        offsetX: -6,
+    },
+    {
+        originX: 'end',
+        originY: 'top',
+        overlayX: 'start',
+        overlayY: 'top',
+        offsetX: 6,
+    },
+];
 
 class DsDropdown {
     // Inputs
@@ -3988,7 +4026,7 @@ class DsModalComponent {
         body.classList.remove('modal-open');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsModalComponent, isStandalone: true, selector: "ds-modal", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "opened", closed: "closed" }, host: { listeners: { "document:keydown.escape": "handleEscape($event)" } }, queries: [{ propertyName: "projectedIcon", first: true, predicate: ["icon"], descendants: true }], viewQueries: [{ propertyName: "modalContainer", first: true, predicate: ["modalContainer"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "@if (shouldRenderOverlay()) {\n  <div class=\"overlay\" role=\"presentation\" (click)=\"onBackdropClick()\"></div>\n}\n@if (open()) {\n  <div #modalContainer\n       class=\"modal\"\n       role=\"dialog\"\n       aria-modal=\"true\"\n       [attr.aria-labelledby]=\"modalTitleId\"\n       [attr.aria-describedby]=\"modalDescId\"\n       [ngClass]=\"modalClasses()\"\n  >\n    <header class=\"modal-header\">\n      @if (showIcon()) {\n        <div class=\"modal-icon\">\n          <ng-content select=\"[icon]\"></ng-content>\n          @if (shouldRenderDefaultIcon() && resolvedIcon()) {\n            <fa-icon [icon]=\"resolvedIcon()!\"></fa-icon>\n          }\n        </div>\n      }\n      <h3 [id]=\"modalTitleId\">{{ title() }}</h3>\n      @if (closable()) {\n        <primitive-button\n          #closeButton\n          class=\"close-btn\"\n          variant=\"ghost\"\n          appearance=\"outline\"\n          size=\"sm\"\n          (clicked)=\"close()\"\n          aria-label=\"Fermer la fen\u00EAtre\"\n        >\u2715</primitive-button>\n      }\n    </header>\n    <div class=\"modal-content\" (scroll)=\"onScroll($event)\">\n      <section [id]=\"modalDescId\"><ng-content></ng-content></section>\n    </div>\n    <footer class=\"modal-footer\" [class.with-shadow]=\"isScrolled()\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </footer>\n  </div>\n}\n", styles: [".overlay{position:fixed;inset:0;background:var(--modal-backdrop);-webkit-backdrop-filter:blur(var(--modal-overlay-blur));backdrop-filter:blur(var(--modal-overlay-blur));z-index:var(--modal-overlay-z-index)}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--modal-bg);color:var(--modal-text);padding:var(--modal-padding);border-radius:var(--modal-radius);box-shadow:var(--modal-shadow-depth);max-height:var(--modal-max-height);border:1px solid var(--modal-border-color);z-index:var(--modal-overlay-z-index);width:min(95vw,var(--modal-size-md));display:flex;flex-direction:column;overflow:hidden;animation:scaleIn .25s var(--easing-default)}.modal-sm{width:min(95vw,var(--modal-size-sm))}.modal-md{width:min(95vw,var(--modal-size-md))}.modal-lg{width:min(95vw,var(--modal-size-lg))}.modal-header{display:flex;align-items:center;gap:var(--modal-section-gap);position:relative;padding-bottom:var(--modal-section-gap);margin-bottom:var(--modal-section-gap);border-bottom:1px solid var(--modal-divider)}.modal-header h3{margin:0;font-size:var(--font-size-5);font-weight:var(--font-weight-semibold)}.modal-header .modal-icon{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;background:var(--color-primary);color:var(--gray-50);animation:popIn .3s var(--easing-default)}.modal-header .close-btn{position:absolute;top:0;right:0}.modal-header .close-btn button{background:transparent;border:none;font-size:var(--font-size-4);cursor:pointer;color:var(--text-muted);padding:var(--space-1);line-height:var(--line-height-tight);border-radius:var(--radius-1);transition:color var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),transform var(--duration-fast) var(--easing-default)}.modal-header .close-btn button:hover{color:var(--text-default);background-color:rgba(var(--black-rgb),.05)}.modal-header .close-btn button:active{transform:scale(.92)}.modal-header .close-btn button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--background-main, #fff),0 0 0 4px var(--color-primary)}.modal-success .modal-header h3{color:var(--modal-type-success-color)}.modal-warning .modal-header h3{color:var(--modal-type-warning-color)}.modal-error .modal-header h3{color:var(--modal-type-error-color)}.modal-info .modal-header h3{color:var(--modal-type-info-color)}.modal-success .modal-icon{background:var(--modal-type-success-color);color:var(--modal-type-success-contrast)}.modal-warning .modal-icon{background:var(--modal-type-warning-color);color:var(--modal-type-warning-contrast)}.modal-error .modal-icon{background:var(--modal-type-error-color);color:var(--modal-type-error-contrast)}.modal-info .modal-icon{background:var(--modal-type-info-color);color:var(--modal-type-info-contrast)}.modal-content{flex:1;overflow-y:auto;font-size:var(--font-size-2);display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--modal-section-gap)}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-2);padding-bottom:var(--modal-footer-padding);padding-inline:0;border-top:1px solid var(--modal-divider);flex-wrap:wrap}@media (max-width: 576px){.modal-footer{flex-direction:column;align-items:stretch;justify-content:center}.modal-footer ds-button{width:100%}}.modal-footer.with-shadow{box-shadow:var(--modal-footer-shadow, inset 0 1px 0 var(--modal-divider))}@keyframes scaleIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "component", type: PrimitiveButton, selector: "primitive-button", inputs: ["type", "variant", "size", "disabled", "iconStart", "iconEnd", "appearance", "block"], outputs: ["clicked"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsModalComponent, isStandalone: true, selector: "ds-modal", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, closeOnBackdrop: { classPropertyName: "closeOnBackdrop", publicName: "closeOnBackdrop", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "opened", closed: "closed" }, host: { listeners: { "document:keydown.escape": "handleEscape($event)" } }, queries: [{ propertyName: "projectedIcon", first: true, predicate: ["icon"], descendants: true }], viewQueries: [{ propertyName: "modalContainer", first: true, predicate: ["modalContainer"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "@if (shouldRenderOverlay()) {\n  <div class=\"overlay\" role=\"presentation\" (click)=\"onBackdropClick()\"></div>\n}\n@if (open()) {\n  <div #modalContainer\n       class=\"modal\"\n       role=\"dialog\"\n       aria-modal=\"true\"\n       [attr.aria-labelledby]=\"modalTitleId\"\n       [attr.aria-describedby]=\"modalDescId\"\n       [ngClass]=\"modalClasses()\"\n  >\n    <header class=\"modal-header\">\n      @if (showIcon()) {\n        <div class=\"modal-icon\">\n          <ng-content select=\"[icon]\"></ng-content>\n          @if (shouldRenderDefaultIcon() && resolvedIcon()) {\n            <fa-icon [icon]=\"resolvedIcon()!\"></fa-icon>\n          }\n        </div>\n      }\n      <h3 [id]=\"modalTitleId\">{{ title() }}</h3>\n      @if (closable()) {\n        <primitive-button\n          #closeButton\n          class=\"close-btn\"\n          variant=\"ghost\"\n          appearance=\"outline\"\n          size=\"sm\"\n          (clicked)=\"close()\"\n          aria-label=\"Fermer la fen\u00EAtre\"\n        >\u2715</primitive-button>\n      }\n    </header>\n    <div class=\"modal-content\" (scroll)=\"onScroll($event)\">\n      <section [id]=\"modalDescId\"><ng-content></ng-content></section>\n    </div>\n    <footer class=\"modal-footer\" [class.with-shadow]=\"isScrolled()\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </footer>\n  </div>\n}\n", styles: [".overlay{position:fixed;inset:0;background:var(--modal-backdrop);-webkit-backdrop-filter:blur(var(--modal-overlay-blur));backdrop-filter:blur(var(--modal-overlay-blur));z-index:var(--modal-overlay-z-index)}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--modal-bg);color:var(--modal-text);padding:var(--modal-padding);border-radius:var(--modal-radius);box-shadow:var(--modal-shadow-depth);max-height:var(--modal-max-height);border:1px solid var(--modal-border-color);z-index:var(--modal-overlay-z-index);width:min(95vw,var(--modal-size-md));display:flex;flex-direction:column;overflow:hidden;animation:scaleIn .25s var(--easing-default)}.modal-sm{width:min(95vw,var(--modal-size-sm))}.modal-md{width:min(95vw,var(--modal-size-md))}.modal-lg{width:min(95vw,var(--modal-size-lg))}.modal-header{display:flex;align-items:center;gap:var(--modal-section-gap);position:relative;padding-bottom:var(--modal-section-gap);margin-bottom:var(--modal-section-gap);border-bottom:1px solid var(--modal-divider)}.modal-header h3{margin:0;font-size:var(--font-size-5);font-weight:var(--font-weight-semibold)}.modal-header .modal-icon{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;background:var(--color-primary);color:var(--gray-50);animation:popIn .3s var(--easing-default)}.modal-header .close-btn{position:absolute;top:0;right:0}.modal-header .close-btn button{background:transparent;border:none;font-size:var(--font-size-4);cursor:pointer;color:var(--text-muted);padding:var(--space-1);line-height:var(--line-height-tight);border-radius:var(--radius-1);transition:color var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),transform var(--duration-fast) var(--easing-default)}.modal-header .close-btn button:hover{color:var(--text-default);background-color:rgba(var(--black-rgb),.05)}.modal-header .close-btn button:active{transform:scale(.92)}.modal-header .close-btn button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--background-main, #fff),0 0 0 4px var(--color-primary)}.modal-success .modal-header h3{color:var(--modal-type-success-color)}.modal-warning .modal-header h3{color:var(--modal-type-warning-color)}.modal-error .modal-header h3{color:var(--modal-type-error-color)}.modal-info .modal-header h3{color:var(--modal-type-info-color)}.modal-success .modal-icon{background:var(--modal-type-success-color);color:var(--modal-type-success-contrast)}.modal-warning .modal-icon{background:var(--modal-type-warning-color);color:var(--modal-type-warning-contrast)}.modal-error .modal-icon{background:var(--modal-type-error-color);color:var(--modal-type-error-contrast)}.modal-info .modal-icon{background:var(--modal-type-info-color);color:var(--modal-type-info-contrast)}.modal-content{flex:1;overflow-y:auto;font-size:var(--font-size-2);display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--modal-section-gap)}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-2);padding-bottom:var(--modal-footer-padding);padding-inline:0;border-top:1px solid var(--modal-divider);flex-wrap:wrap}@media(max-width:576px){.modal-footer{flex-direction:column;align-items:stretch;justify-content:center}.modal-footer ds-button{width:100%}}.modal-footer.with-shadow{box-shadow:var(--modal-footer-shadow, inset 0 1px 0 var(--modal-divider))}@keyframes scaleIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "component", type: PrimitiveButton, selector: "primitive-button", inputs: ["type", "variant", "size", "disabled", "iconStart", "iconEnd", "appearance", "block"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsModalComponent, decorators: [{
             type: Component,
@@ -3996,7 +4034,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                         NgClass,
                         FaIconComponent,
                         PrimitiveButton
-                    ], template: "@if (shouldRenderOverlay()) {\n  <div class=\"overlay\" role=\"presentation\" (click)=\"onBackdropClick()\"></div>\n}\n@if (open()) {\n  <div #modalContainer\n       class=\"modal\"\n       role=\"dialog\"\n       aria-modal=\"true\"\n       [attr.aria-labelledby]=\"modalTitleId\"\n       [attr.aria-describedby]=\"modalDescId\"\n       [ngClass]=\"modalClasses()\"\n  >\n    <header class=\"modal-header\">\n      @if (showIcon()) {\n        <div class=\"modal-icon\">\n          <ng-content select=\"[icon]\"></ng-content>\n          @if (shouldRenderDefaultIcon() && resolvedIcon()) {\n            <fa-icon [icon]=\"resolvedIcon()!\"></fa-icon>\n          }\n        </div>\n      }\n      <h3 [id]=\"modalTitleId\">{{ title() }}</h3>\n      @if (closable()) {\n        <primitive-button\n          #closeButton\n          class=\"close-btn\"\n          variant=\"ghost\"\n          appearance=\"outline\"\n          size=\"sm\"\n          (clicked)=\"close()\"\n          aria-label=\"Fermer la fen\u00EAtre\"\n        >\u2715</primitive-button>\n      }\n    </header>\n    <div class=\"modal-content\" (scroll)=\"onScroll($event)\">\n      <section [id]=\"modalDescId\"><ng-content></ng-content></section>\n    </div>\n    <footer class=\"modal-footer\" [class.with-shadow]=\"isScrolled()\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </footer>\n  </div>\n}\n", styles: [".overlay{position:fixed;inset:0;background:var(--modal-backdrop);-webkit-backdrop-filter:blur(var(--modal-overlay-blur));backdrop-filter:blur(var(--modal-overlay-blur));z-index:var(--modal-overlay-z-index)}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--modal-bg);color:var(--modal-text);padding:var(--modal-padding);border-radius:var(--modal-radius);box-shadow:var(--modal-shadow-depth);max-height:var(--modal-max-height);border:1px solid var(--modal-border-color);z-index:var(--modal-overlay-z-index);width:min(95vw,var(--modal-size-md));display:flex;flex-direction:column;overflow:hidden;animation:scaleIn .25s var(--easing-default)}.modal-sm{width:min(95vw,var(--modal-size-sm))}.modal-md{width:min(95vw,var(--modal-size-md))}.modal-lg{width:min(95vw,var(--modal-size-lg))}.modal-header{display:flex;align-items:center;gap:var(--modal-section-gap);position:relative;padding-bottom:var(--modal-section-gap);margin-bottom:var(--modal-section-gap);border-bottom:1px solid var(--modal-divider)}.modal-header h3{margin:0;font-size:var(--font-size-5);font-weight:var(--font-weight-semibold)}.modal-header .modal-icon{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;background:var(--color-primary);color:var(--gray-50);animation:popIn .3s var(--easing-default)}.modal-header .close-btn{position:absolute;top:0;right:0}.modal-header .close-btn button{background:transparent;border:none;font-size:var(--font-size-4);cursor:pointer;color:var(--text-muted);padding:var(--space-1);line-height:var(--line-height-tight);border-radius:var(--radius-1);transition:color var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),transform var(--duration-fast) var(--easing-default)}.modal-header .close-btn button:hover{color:var(--text-default);background-color:rgba(var(--black-rgb),.05)}.modal-header .close-btn button:active{transform:scale(.92)}.modal-header .close-btn button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--background-main, #fff),0 0 0 4px var(--color-primary)}.modal-success .modal-header h3{color:var(--modal-type-success-color)}.modal-warning .modal-header h3{color:var(--modal-type-warning-color)}.modal-error .modal-header h3{color:var(--modal-type-error-color)}.modal-info .modal-header h3{color:var(--modal-type-info-color)}.modal-success .modal-icon{background:var(--modal-type-success-color);color:var(--modal-type-success-contrast)}.modal-warning .modal-icon{background:var(--modal-type-warning-color);color:var(--modal-type-warning-contrast)}.modal-error .modal-icon{background:var(--modal-type-error-color);color:var(--modal-type-error-contrast)}.modal-info .modal-icon{background:var(--modal-type-info-color);color:var(--modal-type-info-contrast)}.modal-content{flex:1;overflow-y:auto;font-size:var(--font-size-2);display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--modal-section-gap)}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-2);padding-bottom:var(--modal-footer-padding);padding-inline:0;border-top:1px solid var(--modal-divider);flex-wrap:wrap}@media (max-width: 576px){.modal-footer{flex-direction:column;align-items:stretch;justify-content:center}.modal-footer ds-button{width:100%}}.modal-footer.with-shadow{box-shadow:var(--modal-footer-shadow, inset 0 1px 0 var(--modal-divider))}@keyframes scaleIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}\n"] }]
+                    ], template: "@if (shouldRenderOverlay()) {\n  <div class=\"overlay\" role=\"presentation\" (click)=\"onBackdropClick()\"></div>\n}\n@if (open()) {\n  <div #modalContainer\n       class=\"modal\"\n       role=\"dialog\"\n       aria-modal=\"true\"\n       [attr.aria-labelledby]=\"modalTitleId\"\n       [attr.aria-describedby]=\"modalDescId\"\n       [ngClass]=\"modalClasses()\"\n  >\n    <header class=\"modal-header\">\n      @if (showIcon()) {\n        <div class=\"modal-icon\">\n          <ng-content select=\"[icon]\"></ng-content>\n          @if (shouldRenderDefaultIcon() && resolvedIcon()) {\n            <fa-icon [icon]=\"resolvedIcon()!\"></fa-icon>\n          }\n        </div>\n      }\n      <h3 [id]=\"modalTitleId\">{{ title() }}</h3>\n      @if (closable()) {\n        <primitive-button\n          #closeButton\n          class=\"close-btn\"\n          variant=\"ghost\"\n          appearance=\"outline\"\n          size=\"sm\"\n          (clicked)=\"close()\"\n          aria-label=\"Fermer la fen\u00EAtre\"\n        >\u2715</primitive-button>\n      }\n    </header>\n    <div class=\"modal-content\" (scroll)=\"onScroll($event)\">\n      <section [id]=\"modalDescId\"><ng-content></ng-content></section>\n    </div>\n    <footer class=\"modal-footer\" [class.with-shadow]=\"isScrolled()\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </footer>\n  </div>\n}\n", styles: [".overlay{position:fixed;inset:0;background:var(--modal-backdrop);-webkit-backdrop-filter:blur(var(--modal-overlay-blur));backdrop-filter:blur(var(--modal-overlay-blur));z-index:var(--modal-overlay-z-index)}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--modal-bg);color:var(--modal-text);padding:var(--modal-padding);border-radius:var(--modal-radius);box-shadow:var(--modal-shadow-depth);max-height:var(--modal-max-height);border:1px solid var(--modal-border-color);z-index:var(--modal-overlay-z-index);width:min(95vw,var(--modal-size-md));display:flex;flex-direction:column;overflow:hidden;animation:scaleIn .25s var(--easing-default)}.modal-sm{width:min(95vw,var(--modal-size-sm))}.modal-md{width:min(95vw,var(--modal-size-md))}.modal-lg{width:min(95vw,var(--modal-size-lg))}.modal-header{display:flex;align-items:center;gap:var(--modal-section-gap);position:relative;padding-bottom:var(--modal-section-gap);margin-bottom:var(--modal-section-gap);border-bottom:1px solid var(--modal-divider)}.modal-header h3{margin:0;font-size:var(--font-size-5);font-weight:var(--font-weight-semibold)}.modal-header .modal-icon{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;background:var(--color-primary);color:var(--gray-50);animation:popIn .3s var(--easing-default)}.modal-header .close-btn{position:absolute;top:0;right:0}.modal-header .close-btn button{background:transparent;border:none;font-size:var(--font-size-4);cursor:pointer;color:var(--text-muted);padding:var(--space-1);line-height:var(--line-height-tight);border-radius:var(--radius-1);transition:color var(--duration-fast) var(--easing-default),background-color var(--duration-fast) var(--easing-default),transform var(--duration-fast) var(--easing-default)}.modal-header .close-btn button:hover{color:var(--text-default);background-color:rgba(var(--black-rgb),.05)}.modal-header .close-btn button:active{transform:scale(.92)}.modal-header .close-btn button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--background-main, #fff),0 0 0 4px var(--color-primary)}.modal-success .modal-header h3{color:var(--modal-type-success-color)}.modal-warning .modal-header h3{color:var(--modal-type-warning-color)}.modal-error .modal-header h3{color:var(--modal-type-error-color)}.modal-info .modal-header h3{color:var(--modal-type-info-color)}.modal-success .modal-icon{background:var(--modal-type-success-color);color:var(--modal-type-success-contrast)}.modal-warning .modal-icon{background:var(--modal-type-warning-color);color:var(--modal-type-warning-contrast)}.modal-error .modal-icon{background:var(--modal-type-error-color);color:var(--modal-type-error-contrast)}.modal-info .modal-icon{background:var(--modal-type-info-color);color:var(--modal-type-info-contrast)}.modal-content{flex:1;overflow-y:auto;font-size:var(--font-size-2);display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--modal-section-gap)}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-2);padding-bottom:var(--modal-footer-padding);padding-inline:0;border-top:1px solid var(--modal-divider);flex-wrap:wrap}@media(max-width:576px){.modal-footer{flex-direction:column;align-items:stretch;justify-content:center}.modal-footer ds-button{width:100%}}.modal-footer.with-shadow{box-shadow:var(--modal-footer-shadow, inset 0 1px 0 var(--modal-divider))}@keyframes scaleIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], closeOnBackdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnBackdrop", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], opened: [{
                 type: Output
             }], closed: [{
@@ -6684,7 +6722,7 @@ class DsContainer {
     <div [class]="containerClasses()" [style]="containerStyle()">
       <ng-content />
     </div>
-  `, isInline: true, styles: [".ds-container{width:100%;max-width:var(--ds-container-lg, 960px);box-sizing:border-box}.ds-container--center{margin-left:auto;margin-right:auto}.ds-container--fluid{max-width:100%}.ds-container--sm{max-width:var(--ds-container-sm, 540px)}.ds-container--md{max-width:var(--ds-container-md, 720px)}.ds-container--lg{max-width:var(--ds-container-lg, 960px)}.ds-container--xl{max-width:var(--ds-container-xl, 1140px)}.ds-container--2xl{max-width:var(--ds-container-2xl, 1320px)}.ds-container--gutter-none{padding-left:0;padding-right:0}.ds-container--gutter-sm{padding-left:var(--ds-container-gutter-sm, var(--space-4));padding-right:var(--ds-container-gutter-sm, var(--space-4))}.ds-container--gutter-md{padding-left:var(--ds-container-gutter-md, var(--space-6));padding-right:var(--ds-container-gutter-md, var(--space-6))}.ds-container--gutter-lg{padding-left:var(--ds-container-gutter-lg, var(--space-8));padding-right:var(--ds-container-gutter-lg, var(--space-8))}.ds-container--padding-y-none{padding-top:0;padding-bottom:0}.ds-container--padding-y-sm{padding-top:var(--space-4);padding-bottom:var(--space-4)}.ds-container--padding-y-md{padding-top:var(--space-6);padding-bottom:var(--space-6)}.ds-container--padding-y-lg{padding-top:var(--space-8);padding-bottom:var(--space-8)}@media (max-width: var(--breakpoint-sm, 575.98px)){.ds-container--gutter-lg{padding-left:var(--space-4);padding-right:var(--space-4)}.ds-container--gutter-md{padding-left:var(--space-3);padding-right:var(--space-3)}}@media (min-width: var(--breakpoint-sm, 576px)) and (max-width: var(--breakpoint-md, 767.98px)){.ds-container--gutter-lg{padding-left:var(--space-5);padding-right:var(--space-5)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, styles: [".ds-container{width:100%;max-width:var(--ds-container-lg, 960px);box-sizing:border-box}.ds-container--center{margin-left:auto;margin-right:auto}.ds-container--fluid{max-width:100%}.ds-container--sm{max-width:var(--ds-container-sm, 540px)}.ds-container--md{max-width:var(--ds-container-md, 720px)}.ds-container--lg{max-width:var(--ds-container-lg, 960px)}.ds-container--xl{max-width:var(--ds-container-xl, 1140px)}.ds-container--2xl{max-width:var(--ds-container-2xl, 1320px)}.ds-container--gutter-none{padding-left:0;padding-right:0}.ds-container--gutter-sm{padding-left:var(--ds-container-gutter-sm, var(--space-4));padding-right:var(--ds-container-gutter-sm, var(--space-4))}.ds-container--gutter-md{padding-left:var(--ds-container-gutter-md, var(--space-6));padding-right:var(--ds-container-gutter-md, var(--space-6))}.ds-container--gutter-lg{padding-left:var(--ds-container-gutter-lg, var(--space-8));padding-right:var(--ds-container-gutter-lg, var(--space-8))}.ds-container--padding-y-none{padding-top:0;padding-bottom:0}.ds-container--padding-y-sm{padding-top:var(--space-4);padding-bottom:var(--space-4)}.ds-container--padding-y-md{padding-top:var(--space-6);padding-bottom:var(--space-6)}.ds-container--padding-y-lg{padding-top:var(--space-8);padding-bottom:var(--space-8)}@media (max-width: var(--breakpoint-sm, 575.98px)){.ds-container--gutter-lg{padding-left:var(--space-4);padding-right:var(--space-4)}.ds-container--gutter-md{padding-left:var(--space-3);padding-right:var(--space-3)}}@media(min-width: var(--breakpoint-sm, 576px))and (max-width: var(--breakpoint-md, 767.98px)){.ds-container--gutter-lg{padding-left:var(--space-5);padding-right:var(--space-5)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsContainer, decorators: [{
             type: Component,
@@ -6692,7 +6730,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
     <div [class]="containerClasses()" [style]="containerStyle()">
       <ng-content />
     </div>
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".ds-container{width:100%;max-width:var(--ds-container-lg, 960px);box-sizing:border-box}.ds-container--center{margin-left:auto;margin-right:auto}.ds-container--fluid{max-width:100%}.ds-container--sm{max-width:var(--ds-container-sm, 540px)}.ds-container--md{max-width:var(--ds-container-md, 720px)}.ds-container--lg{max-width:var(--ds-container-lg, 960px)}.ds-container--xl{max-width:var(--ds-container-xl, 1140px)}.ds-container--2xl{max-width:var(--ds-container-2xl, 1320px)}.ds-container--gutter-none{padding-left:0;padding-right:0}.ds-container--gutter-sm{padding-left:var(--ds-container-gutter-sm, var(--space-4));padding-right:var(--ds-container-gutter-sm, var(--space-4))}.ds-container--gutter-md{padding-left:var(--ds-container-gutter-md, var(--space-6));padding-right:var(--ds-container-gutter-md, var(--space-6))}.ds-container--gutter-lg{padding-left:var(--ds-container-gutter-lg, var(--space-8));padding-right:var(--ds-container-gutter-lg, var(--space-8))}.ds-container--padding-y-none{padding-top:0;padding-bottom:0}.ds-container--padding-y-sm{padding-top:var(--space-4);padding-bottom:var(--space-4)}.ds-container--padding-y-md{padding-top:var(--space-6);padding-bottom:var(--space-6)}.ds-container--padding-y-lg{padding-top:var(--space-8);padding-bottom:var(--space-8)}@media (max-width: var(--breakpoint-sm, 575.98px)){.ds-container--gutter-lg{padding-left:var(--space-4);padding-right:var(--space-4)}.ds-container--gutter-md{padding-left:var(--space-3);padding-right:var(--space-3)}}@media (min-width: var(--breakpoint-sm, 576px)) and (max-width: var(--breakpoint-md, 767.98px)){.ds-container--gutter-lg{padding-left:var(--space-5);padding-right:var(--space-5)}}\n"] }]
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".ds-container{width:100%;max-width:var(--ds-container-lg, 960px);box-sizing:border-box}.ds-container--center{margin-left:auto;margin-right:auto}.ds-container--fluid{max-width:100%}.ds-container--sm{max-width:var(--ds-container-sm, 540px)}.ds-container--md{max-width:var(--ds-container-md, 720px)}.ds-container--lg{max-width:var(--ds-container-lg, 960px)}.ds-container--xl{max-width:var(--ds-container-xl, 1140px)}.ds-container--2xl{max-width:var(--ds-container-2xl, 1320px)}.ds-container--gutter-none{padding-left:0;padding-right:0}.ds-container--gutter-sm{padding-left:var(--ds-container-gutter-sm, var(--space-4));padding-right:var(--ds-container-gutter-sm, var(--space-4))}.ds-container--gutter-md{padding-left:var(--ds-container-gutter-md, var(--space-6));padding-right:var(--ds-container-gutter-md, var(--space-6))}.ds-container--gutter-lg{padding-left:var(--ds-container-gutter-lg, var(--space-8));padding-right:var(--ds-container-gutter-lg, var(--space-8))}.ds-container--padding-y-none{padding-top:0;padding-bottom:0}.ds-container--padding-y-sm{padding-top:var(--space-4);padding-bottom:var(--space-4)}.ds-container--padding-y-md{padding-top:var(--space-6);padding-bottom:var(--space-6)}.ds-container--padding-y-lg{padding-top:var(--space-8);padding-bottom:var(--space-8)}@media (max-width: var(--breakpoint-sm, 575.98px)){.ds-container--gutter-lg{padding-left:var(--space-4);padding-right:var(--space-4)}.ds-container--gutter-md{padding-left:var(--space-3);padding-right:var(--space-3)}}@media(min-width: var(--breakpoint-sm, 576px))and (max-width: var(--breakpoint-md, 767.98px)){.ds-container--gutter-lg{padding-left:var(--space-5);padding-right:var(--space-5)}}\n"] }]
         }], propDecorators: { maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], center: [{ type: i0.Input, args: [{ isSignal: true, alias: "center", required: false }] }], gutter: [{ type: i0.Input, args: [{ isSignal: true, alias: "gutter", required: false }] }], paddingY: [{ type: i0.Input, args: [{ isSignal: true, alias: "paddingY", required: false }] }], customClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "customClass", required: false }] }] } });
 
 /**
@@ -9557,7 +9595,7 @@ class DsTimePickerPanelComponent {
             const val = this.value();
             const fmt = this.format();
             this.parseAndSetValue(val, fmt);
-        }, { allowSignalWrites: true });
+        });
     }
     ngAfterViewInit() {
         this.initialized = true;
@@ -10456,10 +10494,12 @@ class DsTreeNodeComponent {
     }, ...(ngDevMode ? [{ debugName: "isIndeterminate" }] : []));
     nodeIcon = computed(() => {
         const node = this.node();
-        // Custom icon
+        // Custom icon with optional expanded variant
         if (node.icon) {
-            // TODO: support custom icons
-            return this.fileIcon;
+            if (this.hasChildren() && this.isExpanded() && node.expandedIcon) {
+                return node.expandedIcon;
+            }
+            return node.icon;
         }
         // Default folder/file icons
         if (this.hasChildren()) {
@@ -11612,11 +11652,11 @@ class DsCarousel {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsCarousel, isStandalone: true, selector: "ds-carousel", inputs: { slides: { classPropertyName: "slides", publicName: "slides", isSignal: true, isRequired: false, transformFunction: null }, autoplay: { classPropertyName: "autoplay", publicName: "autoplay", isSignal: true, isRequired: false, transformFunction: null }, autoplaySpeed: { classPropertyName: "autoplaySpeed", publicName: "autoplaySpeed", isSignal: true, isRequired: false, transformFunction: null }, effect: { classPropertyName: "effect", publicName: "effect", isSignal: true, isRequired: false, transformFunction: null }, dots: { classPropertyName: "dots", publicName: "dots", isSignal: true, isRequired: false, transformFunction: null }, dotsPosition: { classPropertyName: "dotsPosition", publicName: "dotsPosition", isSignal: true, isRequired: false, transformFunction: null }, arrows: { classPropertyName: "arrows", publicName: "arrows", isSignal: true, isRequired: false, transformFunction: null }, infinite: { classPropertyName: "infinite", publicName: "infinite", isSignal: true, isRequired: false, transformFunction: null }, pauseOnHover: { classPropertyName: "pauseOnHover", publicName: "pauseOnHover", isSignal: true, isRequired: false, transformFunction: null }, activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideChange: "slideChange" }, viewQueries: [{ propertyName: "trackElement", first: true, predicate: ["track"], descendants: true }, { propertyName: "slideElements", predicate: ["slideElement"], descendants: true }], ngImport: i0, template: "<div\n  [class]=\"containerClasses()\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n  (keydown)=\"onKeydown($event)\"\n  (touchstart)=\"onTouchStart($event)\"\n  (touchmove)=\"onTouchMove($event)\"\n  (touchend)=\"onTouchEnd($event)\"\n  tabindex=\"0\"\n  role=\"region\"\n  aria-roledescription=\"carousel\"\n  [attr.aria-label]=\"'Carousel with ' + slides().length + ' slides'\"\n>\n  <!-- Arrows -->\n  @if (arrows() && slides().length > 1) {\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--left\"\n      (click)=\"prev()\"\n      [attr.aria-label]=\"'Previous slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.left\" />\n    </button>\n\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--right\"\n      (click)=\"next()\"\n      [attr.aria-label]=\"'Next slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.right\" />\n    </button>\n  }\n\n  <!-- Slides container -->\n  <div class=\"ds-carousel__container\">\n    <div\n      class=\"ds-carousel__track\"\n      #track\n      [ngStyle]=\"trackStyle()\"\n      role=\"list\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <div\n          class=\"{{ slideClasses(i) }}\"\n          #slideElement\n          role=\"listitem\"\n          [attr.aria-hidden]=\"i !== internalActiveIndex()\"\n          [attr.aria-label]=\"'Slide ' + (i + 1) + ' of ' + slides().length\"\n        >\n          @if (slide.image) {\n            <img\n              [src]=\"slide.image\"\n              [alt]=\"slide.alt || slide.title || 'Slide ' + (i + 1)\"\n              class=\"ds-carousel__image\"\n            />\n          }\n\n          @if (slide.title || slide.description) {\n            <div class=\"ds-carousel__content\">\n              @if (slide.title) {\n                <h3 class=\"ds-carousel__title\">{{ slide.title }}</h3>\n              }\n              @if (slide.description) {\n                <p class=\"ds-carousel__description\">{{ slide.description }}</p>\n              }\n            </div>\n          }\n\n          <!-- Content projection for custom slides -->\n          <ng-content select=\"[carousel-slide]\" />\n        </div>\n      }\n    </div>\n  </div>\n\n  <!-- Dots -->\n  @if (dots() && slides().length > 1) {\n    <div\n      class=\"ds-carousel__dots\"\n      role=\"tablist\"\n      [attr.aria-label]=\"'Carousel navigation'\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <button\n          type=\"button\"\n          [class]=\"dotClasses(i)\"\n          (click)=\"goTo(i)\"\n          role=\"tab\"\n          [attr.aria-selected]=\"i === internalActiveIndex()\"\n          [attr.aria-label]=\"'Go to slide ' + (i + 1)\"\n          [attr.aria-controls]=\"'carousel-slide-' + i\"\n        >\n          <span class=\"ds-carousel__dot-inner\"></span>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ds-carousel{position:relative;width:100%;overflow:hidden;background-color:var(--carousel-bg, var(--gray-50));border-radius:var(--carousel-radius, var(--radius-2));outline:none}.ds-carousel__container{position:relative;width:100%;height:400px;overflow:hidden}.ds-carousel__track{display:flex;height:100%;transition:transform .3s ease-in-out}.ds-carousel__slide{position:relative;flex:0 0 100%;width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease-in-out}.ds-carousel__slide--fade{position:absolute;top:0;left:0;opacity:0;transition:opacity .5s ease-in-out}.ds-carousel__slide--fade.ds-carousel__slide--active{opacity:1;z-index:1}.ds-carousel__image{width:100%;height:100%;object-fit:cover;display:block}.ds-carousel__content{position:absolute;bottom:0;left:0;right:0;padding:var(--carousel-content-padding, var(--space-6));background:var(--carousel-content-bg, linear-gradient(to top, rgba(0, 0, 0, .7), transparent));color:var(--carousel-content-text, var(--white))}.ds-carousel__title{margin:0 0 var(--space-2) 0;font-size:var(--carousel-title-size, var(--font-size-5));font-weight:var(--font-weight-bold, 700);line-height:1.2}.ds-carousel__description{margin:0;font-size:var(--carousel-description-size, var(--font-size-3));line-height:1.5;opacity:.95}.ds-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;justify-content:center;width:var(--carousel-arrow-size, 40px);height:var(--carousel-arrow-size, 40px);padding:0;background-color:var(--carousel-arrow-bg, rgba(255, 255, 255, .9));color:var(--carousel-arrow-color, var(--gray-800));border:none;border-radius:var(--carousel-arrow-radius, 50%);cursor:pointer;transition:all .2s ease;box-shadow:var(--carousel-arrow-shadow, var(--shadow-md))}.ds-carousel__arrow:hover{background-color:var(--carousel-arrow-bg-hover, var(--white));color:var(--carousel-arrow-color-hover, var(--color-primary));transform:translateY(-50%) scale(1.1)}.ds-carousel__arrow:active{transform:translateY(-50%) scale(.95)}.ds-carousel__arrow:focus-visible{outline:2px solid var(--carousel-arrow-focus, var(--color-primary));outline-offset:2px}.ds-carousel__arrow--left{left:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow--right{right:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow fa-icon{font-size:var(--carousel-arrow-icon-size, var(--font-size-4))}.ds-carousel__dots{position:absolute;z-index:10;display:flex;gap:var(--carousel-dots-gap, var(--space-2));padding:var(--carousel-dots-padding, var(--space-4))}.ds-carousel--dots-bottom .ds-carousel__dots{bottom:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-top .ds-carousel__dots{top:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-left .ds-carousel__dots{top:50%;left:0;transform:translateY(-50%);flex-direction:column}.ds-carousel--dots-right .ds-carousel__dots{top:50%;right:0;transform:translateY(-50%);flex-direction:column}.ds-carousel__dot{padding:0;border:none;background:transparent;cursor:pointer;transition:all .3s ease}.ds-carousel__dot:focus-visible{outline:2px solid var(--carousel-dot-focus, var(--color-primary));outline-offset:2px;border-radius:50%}.ds-carousel__dot-inner{display:block;width:var(--carousel-dot-size, 10px);height:var(--carousel-dot-size, 10px);background-color:var(--carousel-dot-bg, rgba(255, 255, 255, .5));border-radius:50%;transition:all .3s ease}.ds-carousel__dot--active .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-active, var(--white));width:var(--carousel-dot-size-active, 12px);height:var(--carousel-dot-size-active, 12px)}.ds-carousel__dot:hover .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-hover, rgba(255, 255, 255, .8));transform:scale(1.2)}.ds-carousel--fade .ds-carousel__track{position:relative}.ds-carousel--fade .ds-carousel__slide{position:absolute;top:0;left:0}.ds-carousel--transitioning{-webkit-user-select:none;user-select:none}@media (max-width: 768px){.ds-carousel__container{height:300px}.ds-carousel__content{padding:var(--space-4)}.ds-carousel__title{font-size:var(--font-size-4)}.ds-carousel__description{font-size:var(--font-size-2)}.ds-carousel__arrow{width:32px;height:32px}.ds-carousel__arrow fa-icon{font-size:var(--font-size-3)}.ds-carousel__arrow--left,.ds-carousel__arrow--right{--carousel-arrow-offset: var(--space-2)}}@media (max-width: 480px){.ds-carousel__container{height:250px}.ds-carousel__arrow{width:28px;height:28px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsCarousel, isStandalone: true, selector: "ds-carousel", inputs: { slides: { classPropertyName: "slides", publicName: "slides", isSignal: true, isRequired: false, transformFunction: null }, autoplay: { classPropertyName: "autoplay", publicName: "autoplay", isSignal: true, isRequired: false, transformFunction: null }, autoplaySpeed: { classPropertyName: "autoplaySpeed", publicName: "autoplaySpeed", isSignal: true, isRequired: false, transformFunction: null }, effect: { classPropertyName: "effect", publicName: "effect", isSignal: true, isRequired: false, transformFunction: null }, dots: { classPropertyName: "dots", publicName: "dots", isSignal: true, isRequired: false, transformFunction: null }, dotsPosition: { classPropertyName: "dotsPosition", publicName: "dotsPosition", isSignal: true, isRequired: false, transformFunction: null }, arrows: { classPropertyName: "arrows", publicName: "arrows", isSignal: true, isRequired: false, transformFunction: null }, infinite: { classPropertyName: "infinite", publicName: "infinite", isSignal: true, isRequired: false, transformFunction: null }, pauseOnHover: { classPropertyName: "pauseOnHover", publicName: "pauseOnHover", isSignal: true, isRequired: false, transformFunction: null }, activeIndex: { classPropertyName: "activeIndex", publicName: "activeIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideChange: "slideChange" }, viewQueries: [{ propertyName: "trackElement", first: true, predicate: ["track"], descendants: true }, { propertyName: "slideElements", predicate: ["slideElement"], descendants: true }], ngImport: i0, template: "<div\n  [class]=\"containerClasses()\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n  (keydown)=\"onKeydown($event)\"\n  (touchstart)=\"onTouchStart($event)\"\n  (touchmove)=\"onTouchMove($event)\"\n  (touchend)=\"onTouchEnd($event)\"\n  tabindex=\"0\"\n  role=\"region\"\n  aria-roledescription=\"carousel\"\n  [attr.aria-label]=\"'Carousel with ' + slides().length + ' slides'\"\n>\n  <!-- Arrows -->\n  @if (arrows() && slides().length > 1) {\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--left\"\n      (click)=\"prev()\"\n      [attr.aria-label]=\"'Previous slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.left\" />\n    </button>\n\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--right\"\n      (click)=\"next()\"\n      [attr.aria-label]=\"'Next slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.right\" />\n    </button>\n  }\n\n  <!-- Slides container -->\n  <div class=\"ds-carousel__container\">\n    <div\n      class=\"ds-carousel__track\"\n      #track\n      [ngStyle]=\"trackStyle()\"\n      role=\"list\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <div\n          class=\"{{ slideClasses(i) }}\"\n          #slideElement\n          role=\"listitem\"\n          [attr.aria-hidden]=\"i !== internalActiveIndex()\"\n          [attr.aria-label]=\"'Slide ' + (i + 1) + ' of ' + slides().length\"\n        >\n          @if (slide.image) {\n            <img\n              [src]=\"slide.image\"\n              [alt]=\"slide.alt || slide.title || 'Slide ' + (i + 1)\"\n              class=\"ds-carousel__image\"\n            />\n          }\n\n          @if (slide.title || slide.description) {\n            <div class=\"ds-carousel__content\">\n              @if (slide.title) {\n                <h3 class=\"ds-carousel__title\">{{ slide.title }}</h3>\n              }\n              @if (slide.description) {\n                <p class=\"ds-carousel__description\">{{ slide.description }}</p>\n              }\n            </div>\n          }\n\n          <!-- Content projection for custom slides -->\n          <ng-content select=\"[carousel-slide]\" />\n        </div>\n      }\n    </div>\n  </div>\n\n  <!-- Dots -->\n  @if (dots() && slides().length > 1) {\n    <div\n      class=\"ds-carousel__dots\"\n      role=\"tablist\"\n      [attr.aria-label]=\"'Carousel navigation'\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <button\n          type=\"button\"\n          [class]=\"dotClasses(i)\"\n          (click)=\"goTo(i)\"\n          role=\"tab\"\n          [attr.aria-selected]=\"i === internalActiveIndex()\"\n          [attr.aria-label]=\"'Go to slide ' + (i + 1)\"\n          [attr.aria-controls]=\"'carousel-slide-' + i\"\n        >\n          <span class=\"ds-carousel__dot-inner\"></span>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ds-carousel{position:relative;width:100%;overflow:hidden;background-color:var(--carousel-bg, var(--gray-50));border-radius:var(--carousel-radius, var(--radius-2));outline:none}.ds-carousel__container{position:relative;width:100%;height:400px;overflow:hidden}.ds-carousel__track{display:flex;height:100%;transition:transform .3s ease-in-out}.ds-carousel__slide{position:relative;flex:0 0 100%;width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease-in-out}.ds-carousel__slide--fade{position:absolute;top:0;left:0;opacity:0;transition:opacity .5s ease-in-out}.ds-carousel__slide--fade.ds-carousel__slide--active{opacity:1;z-index:1}.ds-carousel__image{width:100%;height:100%;object-fit:cover;display:block}.ds-carousel__content{position:absolute;bottom:0;left:0;right:0;padding:var(--carousel-content-padding, var(--space-6));background:var(--carousel-content-bg, linear-gradient(to top, rgba(0, 0, 0, .7), transparent));color:var(--carousel-content-text, var(--white))}.ds-carousel__title{margin:0 0 var(--space-2) 0;font-size:var(--carousel-title-size, var(--font-size-5));font-weight:var(--font-weight-bold, 700);line-height:1.2}.ds-carousel__description{margin:0;font-size:var(--carousel-description-size, var(--font-size-3));line-height:1.5;opacity:.95}.ds-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;justify-content:center;width:var(--carousel-arrow-size, 40px);height:var(--carousel-arrow-size, 40px);padding:0;background-color:var(--carousel-arrow-bg, rgba(255, 255, 255, .9));color:var(--carousel-arrow-color, var(--gray-800));border:none;border-radius:var(--carousel-arrow-radius, 50%);cursor:pointer;transition:all .2s ease;box-shadow:var(--carousel-arrow-shadow, var(--shadow-md))}.ds-carousel__arrow:hover{background-color:var(--carousel-arrow-bg-hover, var(--white));color:var(--carousel-arrow-color-hover, var(--color-primary));transform:translateY(-50%) scale(1.1)}.ds-carousel__arrow:active{transform:translateY(-50%) scale(.95)}.ds-carousel__arrow:focus-visible{outline:2px solid var(--carousel-arrow-focus, var(--color-primary));outline-offset:2px}.ds-carousel__arrow--left{left:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow--right{right:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow fa-icon{font-size:var(--carousel-arrow-icon-size, var(--font-size-4))}.ds-carousel__dots{position:absolute;z-index:10;display:flex;gap:var(--carousel-dots-gap, var(--space-2));padding:var(--carousel-dots-padding, var(--space-4))}.ds-carousel--dots-bottom .ds-carousel__dots{bottom:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-top .ds-carousel__dots{top:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-left .ds-carousel__dots{top:50%;left:0;transform:translateY(-50%);flex-direction:column}.ds-carousel--dots-right .ds-carousel__dots{top:50%;right:0;transform:translateY(-50%);flex-direction:column}.ds-carousel__dot{padding:0;border:none;background:transparent;cursor:pointer;transition:all .3s ease}.ds-carousel__dot:focus-visible{outline:2px solid var(--carousel-dot-focus, var(--color-primary));outline-offset:2px;border-radius:50%}.ds-carousel__dot-inner{display:block;width:var(--carousel-dot-size, 10px);height:var(--carousel-dot-size, 10px);background-color:var(--carousel-dot-bg, rgba(255, 255, 255, .5));border-radius:50%;transition:all .3s ease}.ds-carousel__dot--active .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-active, var(--white));width:var(--carousel-dot-size-active, 12px);height:var(--carousel-dot-size-active, 12px)}.ds-carousel__dot:hover .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-hover, rgba(255, 255, 255, .8));transform:scale(1.2)}.ds-carousel--fade .ds-carousel__track{position:relative}.ds-carousel--fade .ds-carousel__slide{position:absolute;top:0;left:0}.ds-carousel--transitioning{-webkit-user-select:none;user-select:none}@media(max-width:768px){.ds-carousel__container{height:300px}.ds-carousel__content{padding:var(--space-4)}.ds-carousel__title{font-size:var(--font-size-4)}.ds-carousel__description{font-size:var(--font-size-2)}.ds-carousel__arrow{width:32px;height:32px}.ds-carousel__arrow fa-icon{font-size:var(--font-size-3)}.ds-carousel__arrow--left,.ds-carousel__arrow--right{--carousel-arrow-offset: var(--space-2)}}@media(max-width:480px){.ds-carousel__container{height:250px}.ds-carousel__arrow{width:28px;height:28px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsCarousel, decorators: [{
             type: Component,
-            args: [{ selector: 'ds-carousel', imports: [CommonModule, FontAwesomeModule], template: "<div\n  [class]=\"containerClasses()\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n  (keydown)=\"onKeydown($event)\"\n  (touchstart)=\"onTouchStart($event)\"\n  (touchmove)=\"onTouchMove($event)\"\n  (touchend)=\"onTouchEnd($event)\"\n  tabindex=\"0\"\n  role=\"region\"\n  aria-roledescription=\"carousel\"\n  [attr.aria-label]=\"'Carousel with ' + slides().length + ' slides'\"\n>\n  <!-- Arrows -->\n  @if (arrows() && slides().length > 1) {\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--left\"\n      (click)=\"prev()\"\n      [attr.aria-label]=\"'Previous slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.left\" />\n    </button>\n\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--right\"\n      (click)=\"next()\"\n      [attr.aria-label]=\"'Next slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.right\" />\n    </button>\n  }\n\n  <!-- Slides container -->\n  <div class=\"ds-carousel__container\">\n    <div\n      class=\"ds-carousel__track\"\n      #track\n      [ngStyle]=\"trackStyle()\"\n      role=\"list\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <div\n          class=\"{{ slideClasses(i) }}\"\n          #slideElement\n          role=\"listitem\"\n          [attr.aria-hidden]=\"i !== internalActiveIndex()\"\n          [attr.aria-label]=\"'Slide ' + (i + 1) + ' of ' + slides().length\"\n        >\n          @if (slide.image) {\n            <img\n              [src]=\"slide.image\"\n              [alt]=\"slide.alt || slide.title || 'Slide ' + (i + 1)\"\n              class=\"ds-carousel__image\"\n            />\n          }\n\n          @if (slide.title || slide.description) {\n            <div class=\"ds-carousel__content\">\n              @if (slide.title) {\n                <h3 class=\"ds-carousel__title\">{{ slide.title }}</h3>\n              }\n              @if (slide.description) {\n                <p class=\"ds-carousel__description\">{{ slide.description }}</p>\n              }\n            </div>\n          }\n\n          <!-- Content projection for custom slides -->\n          <ng-content select=\"[carousel-slide]\" />\n        </div>\n      }\n    </div>\n  </div>\n\n  <!-- Dots -->\n  @if (dots() && slides().length > 1) {\n    <div\n      class=\"ds-carousel__dots\"\n      role=\"tablist\"\n      [attr.aria-label]=\"'Carousel navigation'\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <button\n          type=\"button\"\n          [class]=\"dotClasses(i)\"\n          (click)=\"goTo(i)\"\n          role=\"tab\"\n          [attr.aria-selected]=\"i === internalActiveIndex()\"\n          [attr.aria-label]=\"'Go to slide ' + (i + 1)\"\n          [attr.aria-controls]=\"'carousel-slide-' + i\"\n        >\n          <span class=\"ds-carousel__dot-inner\"></span>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ds-carousel{position:relative;width:100%;overflow:hidden;background-color:var(--carousel-bg, var(--gray-50));border-radius:var(--carousel-radius, var(--radius-2));outline:none}.ds-carousel__container{position:relative;width:100%;height:400px;overflow:hidden}.ds-carousel__track{display:flex;height:100%;transition:transform .3s ease-in-out}.ds-carousel__slide{position:relative;flex:0 0 100%;width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease-in-out}.ds-carousel__slide--fade{position:absolute;top:0;left:0;opacity:0;transition:opacity .5s ease-in-out}.ds-carousel__slide--fade.ds-carousel__slide--active{opacity:1;z-index:1}.ds-carousel__image{width:100%;height:100%;object-fit:cover;display:block}.ds-carousel__content{position:absolute;bottom:0;left:0;right:0;padding:var(--carousel-content-padding, var(--space-6));background:var(--carousel-content-bg, linear-gradient(to top, rgba(0, 0, 0, .7), transparent));color:var(--carousel-content-text, var(--white))}.ds-carousel__title{margin:0 0 var(--space-2) 0;font-size:var(--carousel-title-size, var(--font-size-5));font-weight:var(--font-weight-bold, 700);line-height:1.2}.ds-carousel__description{margin:0;font-size:var(--carousel-description-size, var(--font-size-3));line-height:1.5;opacity:.95}.ds-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;justify-content:center;width:var(--carousel-arrow-size, 40px);height:var(--carousel-arrow-size, 40px);padding:0;background-color:var(--carousel-arrow-bg, rgba(255, 255, 255, .9));color:var(--carousel-arrow-color, var(--gray-800));border:none;border-radius:var(--carousel-arrow-radius, 50%);cursor:pointer;transition:all .2s ease;box-shadow:var(--carousel-arrow-shadow, var(--shadow-md))}.ds-carousel__arrow:hover{background-color:var(--carousel-arrow-bg-hover, var(--white));color:var(--carousel-arrow-color-hover, var(--color-primary));transform:translateY(-50%) scale(1.1)}.ds-carousel__arrow:active{transform:translateY(-50%) scale(.95)}.ds-carousel__arrow:focus-visible{outline:2px solid var(--carousel-arrow-focus, var(--color-primary));outline-offset:2px}.ds-carousel__arrow--left{left:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow--right{right:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow fa-icon{font-size:var(--carousel-arrow-icon-size, var(--font-size-4))}.ds-carousel__dots{position:absolute;z-index:10;display:flex;gap:var(--carousel-dots-gap, var(--space-2));padding:var(--carousel-dots-padding, var(--space-4))}.ds-carousel--dots-bottom .ds-carousel__dots{bottom:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-top .ds-carousel__dots{top:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-left .ds-carousel__dots{top:50%;left:0;transform:translateY(-50%);flex-direction:column}.ds-carousel--dots-right .ds-carousel__dots{top:50%;right:0;transform:translateY(-50%);flex-direction:column}.ds-carousel__dot{padding:0;border:none;background:transparent;cursor:pointer;transition:all .3s ease}.ds-carousel__dot:focus-visible{outline:2px solid var(--carousel-dot-focus, var(--color-primary));outline-offset:2px;border-radius:50%}.ds-carousel__dot-inner{display:block;width:var(--carousel-dot-size, 10px);height:var(--carousel-dot-size, 10px);background-color:var(--carousel-dot-bg, rgba(255, 255, 255, .5));border-radius:50%;transition:all .3s ease}.ds-carousel__dot--active .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-active, var(--white));width:var(--carousel-dot-size-active, 12px);height:var(--carousel-dot-size-active, 12px)}.ds-carousel__dot:hover .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-hover, rgba(255, 255, 255, .8));transform:scale(1.2)}.ds-carousel--fade .ds-carousel__track{position:relative}.ds-carousel--fade .ds-carousel__slide{position:absolute;top:0;left:0}.ds-carousel--transitioning{-webkit-user-select:none;user-select:none}@media (max-width: 768px){.ds-carousel__container{height:300px}.ds-carousel__content{padding:var(--space-4)}.ds-carousel__title{font-size:var(--font-size-4)}.ds-carousel__description{font-size:var(--font-size-2)}.ds-carousel__arrow{width:32px;height:32px}.ds-carousel__arrow fa-icon{font-size:var(--font-size-3)}.ds-carousel__arrow--left,.ds-carousel__arrow--right{--carousel-arrow-offset: var(--space-2)}}@media (max-width: 480px){.ds-carousel__container{height:250px}.ds-carousel__arrow{width:28px;height:28px}}\n"] }]
+            args: [{ selector: 'ds-carousel', imports: [CommonModule, FontAwesomeModule], template: "<div\n  [class]=\"containerClasses()\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n  (keydown)=\"onKeydown($event)\"\n  (touchstart)=\"onTouchStart($event)\"\n  (touchmove)=\"onTouchMove($event)\"\n  (touchend)=\"onTouchEnd($event)\"\n  tabindex=\"0\"\n  role=\"region\"\n  aria-roledescription=\"carousel\"\n  [attr.aria-label]=\"'Carousel with ' + slides().length + ' slides'\"\n>\n  <!-- Arrows -->\n  @if (arrows() && slides().length > 1) {\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--left\"\n      (click)=\"prev()\"\n      [attr.aria-label]=\"'Previous slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.left\" />\n    </button>\n\n    <button\n      class=\"ds-carousel__arrow ds-carousel__arrow--right\"\n      (click)=\"next()\"\n      [attr.aria-label]=\"'Next slide'\"\n      type=\"button\"\n    >\n      <fa-icon [icon]=\"icons.right\" />\n    </button>\n  }\n\n  <!-- Slides container -->\n  <div class=\"ds-carousel__container\">\n    <div\n      class=\"ds-carousel__track\"\n      #track\n      [ngStyle]=\"trackStyle()\"\n      role=\"list\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <div\n          class=\"{{ slideClasses(i) }}\"\n          #slideElement\n          role=\"listitem\"\n          [attr.aria-hidden]=\"i !== internalActiveIndex()\"\n          [attr.aria-label]=\"'Slide ' + (i + 1) + ' of ' + slides().length\"\n        >\n          @if (slide.image) {\n            <img\n              [src]=\"slide.image\"\n              [alt]=\"slide.alt || slide.title || 'Slide ' + (i + 1)\"\n              class=\"ds-carousel__image\"\n            />\n          }\n\n          @if (slide.title || slide.description) {\n            <div class=\"ds-carousel__content\">\n              @if (slide.title) {\n                <h3 class=\"ds-carousel__title\">{{ slide.title }}</h3>\n              }\n              @if (slide.description) {\n                <p class=\"ds-carousel__description\">{{ slide.description }}</p>\n              }\n            </div>\n          }\n\n          <!-- Content projection for custom slides -->\n          <ng-content select=\"[carousel-slide]\" />\n        </div>\n      }\n    </div>\n  </div>\n\n  <!-- Dots -->\n  @if (dots() && slides().length > 1) {\n    <div\n      class=\"ds-carousel__dots\"\n      role=\"tablist\"\n      [attr.aria-label]=\"'Carousel navigation'\"\n    >\n      @for (slide of slides(); track slide.id; let i = $index) {\n        <button\n          type=\"button\"\n          [class]=\"dotClasses(i)\"\n          (click)=\"goTo(i)\"\n          role=\"tab\"\n          [attr.aria-selected]=\"i === internalActiveIndex()\"\n          [attr.aria-label]=\"'Go to slide ' + (i + 1)\"\n          [attr.aria-controls]=\"'carousel-slide-' + i\"\n        >\n          <span class=\"ds-carousel__dot-inner\"></span>\n        </button>\n      }\n    </div>\n  }\n</div>\n", styles: [".ds-carousel{position:relative;width:100%;overflow:hidden;background-color:var(--carousel-bg, var(--gray-50));border-radius:var(--carousel-radius, var(--radius-2));outline:none}.ds-carousel__container{position:relative;width:100%;height:400px;overflow:hidden}.ds-carousel__track{display:flex;height:100%;transition:transform .3s ease-in-out}.ds-carousel__slide{position:relative;flex:0 0 100%;width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .3s ease-in-out}.ds-carousel__slide--fade{position:absolute;top:0;left:0;opacity:0;transition:opacity .5s ease-in-out}.ds-carousel__slide--fade.ds-carousel__slide--active{opacity:1;z-index:1}.ds-carousel__image{width:100%;height:100%;object-fit:cover;display:block}.ds-carousel__content{position:absolute;bottom:0;left:0;right:0;padding:var(--carousel-content-padding, var(--space-6));background:var(--carousel-content-bg, linear-gradient(to top, rgba(0, 0, 0, .7), transparent));color:var(--carousel-content-text, var(--white))}.ds-carousel__title{margin:0 0 var(--space-2) 0;font-size:var(--carousel-title-size, var(--font-size-5));font-weight:var(--font-weight-bold, 700);line-height:1.2}.ds-carousel__description{margin:0;font-size:var(--carousel-description-size, var(--font-size-3));line-height:1.5;opacity:.95}.ds-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;justify-content:center;width:var(--carousel-arrow-size, 40px);height:var(--carousel-arrow-size, 40px);padding:0;background-color:var(--carousel-arrow-bg, rgba(255, 255, 255, .9));color:var(--carousel-arrow-color, var(--gray-800));border:none;border-radius:var(--carousel-arrow-radius, 50%);cursor:pointer;transition:all .2s ease;box-shadow:var(--carousel-arrow-shadow, var(--shadow-md))}.ds-carousel__arrow:hover{background-color:var(--carousel-arrow-bg-hover, var(--white));color:var(--carousel-arrow-color-hover, var(--color-primary));transform:translateY(-50%) scale(1.1)}.ds-carousel__arrow:active{transform:translateY(-50%) scale(.95)}.ds-carousel__arrow:focus-visible{outline:2px solid var(--carousel-arrow-focus, var(--color-primary));outline-offset:2px}.ds-carousel__arrow--left{left:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow--right{right:var(--carousel-arrow-offset, var(--space-4))}.ds-carousel__arrow fa-icon{font-size:var(--carousel-arrow-icon-size, var(--font-size-4))}.ds-carousel__dots{position:absolute;z-index:10;display:flex;gap:var(--carousel-dots-gap, var(--space-2));padding:var(--carousel-dots-padding, var(--space-4))}.ds-carousel--dots-bottom .ds-carousel__dots{bottom:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-top .ds-carousel__dots{top:0;left:50%;transform:translate(-50%);flex-direction:row}.ds-carousel--dots-left .ds-carousel__dots{top:50%;left:0;transform:translateY(-50%);flex-direction:column}.ds-carousel--dots-right .ds-carousel__dots{top:50%;right:0;transform:translateY(-50%);flex-direction:column}.ds-carousel__dot{padding:0;border:none;background:transparent;cursor:pointer;transition:all .3s ease}.ds-carousel__dot:focus-visible{outline:2px solid var(--carousel-dot-focus, var(--color-primary));outline-offset:2px;border-radius:50%}.ds-carousel__dot-inner{display:block;width:var(--carousel-dot-size, 10px);height:var(--carousel-dot-size, 10px);background-color:var(--carousel-dot-bg, rgba(255, 255, 255, .5));border-radius:50%;transition:all .3s ease}.ds-carousel__dot--active .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-active, var(--white));width:var(--carousel-dot-size-active, 12px);height:var(--carousel-dot-size-active, 12px)}.ds-carousel__dot:hover .ds-carousel__dot-inner{background-color:var(--carousel-dot-bg-hover, rgba(255, 255, 255, .8));transform:scale(1.2)}.ds-carousel--fade .ds-carousel__track{position:relative}.ds-carousel--fade .ds-carousel__slide{position:absolute;top:0;left:0}.ds-carousel--transitioning{-webkit-user-select:none;user-select:none}@media(max-width:768px){.ds-carousel__container{height:300px}.ds-carousel__content{padding:var(--space-4)}.ds-carousel__title{font-size:var(--font-size-4)}.ds-carousel__description{font-size:var(--font-size-2)}.ds-carousel__arrow{width:32px;height:32px}.ds-carousel__arrow fa-icon{font-size:var(--font-size-3)}.ds-carousel__arrow--left,.ds-carousel__arrow--right{--carousel-arrow-offset: var(--space-2)}}@media(max-width:480px){.ds-carousel__container{height:250px}.ds-carousel__arrow{width:28px;height:28px}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { slides: [{ type: i0.Input, args: [{ isSignal: true, alias: "slides", required: false }] }], autoplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoplay", required: false }] }], autoplaySpeed: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoplaySpeed", required: false }] }], effect: [{ type: i0.Input, args: [{ isSignal: true, alias: "effect", required: false }] }], dots: [{ type: i0.Input, args: [{ isSignal: true, alias: "dots", required: false }] }], dotsPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "dotsPosition", required: false }] }], arrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "arrows", required: false }] }], infinite: [{ type: i0.Input, args: [{ isSignal: true, alias: "infinite", required: false }] }], pauseOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "pauseOnHover", required: false }] }], activeIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeIndex", required: false }] }], slideChange: [{ type: i0.Output, args: ["slideChange"] }], trackElement: [{
                 type: ViewChild,
                 args: ['track', { static: false }]
@@ -11985,11 +12025,11 @@ class DsCalendar {
         effect(() => {
             const value = this.value();
             this.displayDate.set(new Date(value));
-        }, { allowSignalWrites: true });
+        });
         // Synchroniser currentMode avec mode
         effect(() => {
             this.currentMode.set(this.mode());
-        }, { allowSignalWrites: true });
+        });
     }
     // =========================================================================
     // MÉTHODES PUBLIQUES
@@ -13731,6 +13771,8 @@ class DsSidebarItemComponent {
     showTooltip = input(true, ...(ngDevMode ? [{ debugName: "showTooltip" }] : []));
     expandedItemIds = input(new Set(), ...(ngDevMode ? [{ debugName: "expandedItemIds" }] : []));
     activeItemId = input(null, ...(ngDevMode ? [{ debugName: "activeItemId" }] : []));
+    sidebarPosition = input('left', ...(ngDevMode ? [{ debugName: "sidebarPosition" }] : []));
+    collapsedTrigger = input('hover', ...(ngDevMode ? [{ debugName: "collapsedTrigger" }] : []));
     // Outputs
     itemClick = output();
     itemToggle = output();
@@ -13742,6 +13784,12 @@ class DsSidebarItemComponent {
     // Injection
     elementRef = inject(ElementRef);
     router = inject(Router);
+    // État du popover (mode collapsed)
+    popoverOpen = signal(false, ...(ngDevMode ? [{ debugName: "popoverOpen" }] : []));
+    isPopoverOpen = computed(() => this.popoverOpen(), ...(ngDevMode ? [{ debugName: "isPopoverOpen" }] : []));
+    activeChildIndex = signal(-1, ...(ngDevMode ? [{ debugName: "activeChildIndex" }] : []));
+    isHoveringPopover = false;
+    hideTimeout = null;
     // Computed
     hasChildren = computed(() => {
         const children = this.item().children;
@@ -13758,6 +13806,12 @@ class DsSidebarItemComponent {
         const levelIndent = 20; // indent par niveau
         return baseIndent + this.level() * levelIndent;
     }, ...(ngDevMode ? [{ debugName: "indentPadding" }] : []));
+    /** Positions du popover selon la position de la sidebar */
+    popoverPositions = computed(() => {
+        return this.sidebarPosition() === 'left'
+            ? SIDEBAR_POPOVER_POSITIONS_RIGHT
+            : SIDEBAR_POPOVER_POSITIONS_LEFT;
+    }, ...(ngDevMode ? [{ debugName: "popoverPositions" }] : []));
     /**
      * Gère le clic sur l'item.
      */
@@ -13767,6 +13821,13 @@ class DsSidebarItemComponent {
             event.stopPropagation();
             return;
         }
+        // En mode collapsed avec trigger click, toggle le popover pour les items avec enfants
+        if (this.mode() === 'collapsed' && this.hasChildren() && this.collapsedTrigger() === 'click') {
+            event.preventDefault();
+            event.stopPropagation();
+            this.togglePopover();
+            return;
+        }
         // Si l'item a des enfants et pas de lien, toggle expand
         if (this.hasChildren() && !this.item().routerLink && !this.item().href) {
             this.itemToggle.emit(this.item());
@@ -13823,26 +13884,214 @@ class DsSidebarItemComponent {
             element.focus();
         }
     }
+    // ============================================
+    // GESTION DU POPOVER (mode collapsed)
+    // ============================================
+    /**
+     * Ouvre le popover (mode collapsed + hasChildren).
+     */
+    openPopover() {
+        if (this.mode() !== 'collapsed' || !this.hasChildren())
+            return;
+        this.clearHideTimeout();
+        this.popoverOpen.set(true);
+        this.activeChildIndex.set(0);
+    }
+    /**
+     * Ferme le popover.
+     */
+    closePopover() {
+        this.popoverOpen.set(false);
+        this.activeChildIndex.set(-1);
+    }
+    /**
+     * Ferme le popover avec un délai.
+     */
+    closePopoverWithDelay() {
+        this.hideTimeout = setTimeout(() => {
+            if (!this.isHoveringPopover) {
+                this.closePopover();
+            }
+        }, 150);
+    }
+    /**
+     * Annule le timeout de fermeture.
+     */
+    clearHideTimeout() {
+        if (this.hideTimeout) {
+            clearTimeout(this.hideTimeout);
+            this.hideTimeout = null;
+        }
+    }
+    /**
+     * Gestion du mouseenter sur l'item (ouvre le popover en mode collapsed + trigger hover).
+     */
+    handleMouseEnter() {
+        if (this.mode() === 'collapsed' && this.hasChildren() && this.collapsedTrigger() === 'hover') {
+            this.openPopover();
+        }
+    }
+    /**
+     * Gestion du mouseleave sur l'item.
+     */
+    handleMouseLeave() {
+        if (this.mode() === 'collapsed' && this.isPopoverOpen() && this.collapsedTrigger() === 'hover') {
+            this.closePopoverWithDelay();
+        }
+    }
+    /**
+     * Toggle le popover (pour le mode click).
+     */
+    togglePopover() {
+        if (this.isPopoverOpen()) {
+            this.closePopover();
+        }
+        else {
+            this.openPopover();
+        }
+    }
+    /**
+     * Gestion du mouseenter sur le popover.
+     */
+    handlePopoverMouseEnter() {
+        this.isHoveringPopover = true;
+        this.clearHideTimeout();
+    }
+    /**
+     * Gestion du mouseleave sur le popover.
+     */
+    handlePopoverMouseLeave() {
+        this.isHoveringPopover = false;
+        if (this.collapsedTrigger() === 'hover') {
+            this.closePopoverWithDelay();
+        }
+    }
+    /**
+     * Navigation clavier dans le popover.
+     */
+    handlePopoverKeydown(event) {
+        const children = this.item().children || [];
+        switch (event.key) {
+            case 'ArrowDown':
+                event.preventDefault();
+                this.moveChildIndex(1, children.length);
+                break;
+            case 'ArrowUp':
+                event.preventDefault();
+                this.moveChildIndex(-1, children.length);
+                break;
+            case 'Escape':
+                event.preventDefault();
+                this.closePopover();
+                break;
+            case 'Enter':
+            case ' ':
+                event.preventDefault();
+                this.selectActiveChild();
+                break;
+        }
+    }
+    /**
+     * Déplace l'index actif dans le popover.
+     */
+    moveChildIndex(direction, total) {
+        let newIndex = this.activeChildIndex() + direction;
+        // Boucle circulaire
+        if (newIndex < 0)
+            newIndex = total - 1;
+        if (newIndex >= total)
+            newIndex = 0;
+        // Skip les items désactivés
+        const children = this.item().children || [];
+        let attempts = 0;
+        while (children[newIndex]?.disabled && attempts < total) {
+            newIndex += direction;
+            if (newIndex < 0)
+                newIndex = total - 1;
+            if (newIndex >= total)
+                newIndex = 0;
+            attempts++;
+        }
+        this.activeChildIndex.set(newIndex);
+    }
+    /**
+     * Sélectionne l'enfant actif dans le popover.
+     */
+    selectActiveChild() {
+        const children = this.item().children || [];
+        const index = this.activeChildIndex();
+        if (index >= 0 && index < children.length) {
+            const child = children[index];
+            if (!child.disabled) {
+                this.handleChildClick(child, new MouseEvent('click'));
+            }
+        }
+    }
+    /**
+     * Gère le clic sur un enfant dans le popover.
+     */
+    handleChildClick(child, event) {
+        if (child.disabled) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+        }
+        // Navigation programmatique pour routerLink
+        if (child.routerLink) {
+            const link = child.routerLink;
+            if (Array.isArray(link)) {
+                void this.router.navigate(link);
+            }
+            else {
+                void this.router.navigate([link]);
+            }
+        }
+        // Navigation href externe
+        if (child.href) {
+            const target = child.external ? '_blank' : '_self';
+            window.open(child.href, target);
+        }
+        this.itemClick.emit({ item: child, event });
+        this.closePopover();
+    }
+    /**
+     * Met à jour l'index actif au hover.
+     */
+    setActiveChildIndex(index) {
+        this.activeChildIndex.set(index);
+    }
+    /**
+     * Retourne l'index actif du popover.
+     */
+    getActiveChildIndex() {
+        return this.activeChildIndex();
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsSidebarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsSidebarItemComponent, isStandalone: true, selector: "ds-sidebar-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, showTooltip: { classPropertyName: "showTooltip", publicName: "showTooltip", isSignal: true, isRequired: false, transformFunction: null }, expandedItemIds: { classPropertyName: "expandedItemIds", publicName: "expandedItemIds", isSignal: true, isRequired: false, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", itemToggle: "itemToggle", itemKeydown: "itemKeydown" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsSidebarItemComponent, isStandalone: true, selector: "ds-sidebar-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: true, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, showTooltip: { classPropertyName: "showTooltip", publicName: "showTooltip", isSignal: true, isRequired: false, transformFunction: null }, expandedItemIds: { classPropertyName: "expandedItemIds", publicName: "expandedItemIds", isSignal: true, isRequired: false, transformFunction: null }, activeItemId: { classPropertyName: "activeItemId", publicName: "activeItemId", isSignal: true, isRequired: false, transformFunction: null }, sidebarPosition: { classPropertyName: "sidebarPosition", publicName: "sidebarPosition", isSignal: true, isRequired: false, transformFunction: null }, collapsedTrigger: { classPropertyName: "collapsedTrigger", publicName: "collapsedTrigger", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", itemToggle: "itemToggle", itemKeydown: "itemKeydown" }, ngImport: i0, template: `
     <!-- Item container -->
     <div
+      #itemTrigger="cdkOverlayOrigin"
+      cdkOverlayOrigin
       class="ds-sidebar-item"
       [class.ds-sidebar-item--active]="isActive()"
       [class.ds-sidebar-item--disabled]="item().disabled"
       [class.ds-sidebar-item--has-children]="hasChildren()"
       [class.ds-sidebar-item--expanded]="isExpanded()"
       [class.ds-sidebar-item--collapsed-mode]="mode() === 'collapsed'"
+      [class.ds-sidebar-item--popover-open]="isPopoverOpen()"
       [style.padding-left.px]="mode() === 'collapsed' ? null : indentPadding()"
       [attr.tabindex]="item().disabled ? -1 : 0"
       role="menuitem"
-      [attr.aria-expanded]="hasChildren() ? isExpanded() : null"
+      [attr.aria-haspopup]="hasChildren() && mode() === 'collapsed' ? 'menu' : null"
+      [attr.aria-expanded]="hasChildren() ? (mode() === 'collapsed' ? isPopoverOpen() : isExpanded()) : null"
       [attr.aria-selected]="isActive()"
       [attr.aria-disabled]="item().disabled"
       [attr.data-item-id]="item().id"
       (click)="handleClick($event)"
       (keydown)="handleKeydown($event)"
-      [dsTooltip]="mode() === 'collapsed' && showTooltip() ? item().label : ''"
+      (mouseenter)="handleMouseEnter()"
+      (mouseleave)="handleMouseLeave()"
+      [dsTooltip]="mode() === 'collapsed' && showTooltip() && !isPopoverOpen() && !hasChildren() ? item().label : ''"
       tooltipPosition="right"
       #itemElement>
 
@@ -13909,6 +14158,76 @@ class DsSidebarItemComponent {
       <div class="ds-sidebar-item__divider" role="separator"></div>
     }
 
+    <!-- Popover pour enfants en mode collapsed -->
+    @if (hasChildren() && mode() === 'collapsed') {
+      <ng-template
+        cdkConnectedOverlay
+        [cdkConnectedOverlayOrigin]="itemTrigger"
+        [cdkConnectedOverlayOpen]="isPopoverOpen()"
+        [cdkConnectedOverlayPositions]="popoverPositions()"
+        [cdkConnectedOverlayHasBackdrop]="true"
+        [cdkConnectedOverlayBackdropClass]="'ds-sidebar-popover-backdrop'"
+        [cdkConnectedOverlayPanelClass]="'ds-sidebar-popover-panel'"
+        (backdropClick)="closePopover()"
+        (detach)="closePopover()">
+
+        <div
+          class="ds-sidebar-popover"
+          role="menu"
+          [attr.aria-label]="'Sous-menu de ' + item().label"
+          (keydown)="handlePopoverKeydown($event)"
+          (mouseenter)="handlePopoverMouseEnter()"
+          (mouseleave)="handlePopoverMouseLeave()">
+
+          <!-- Header du popover avec le label parent -->
+          <div class="ds-sidebar-popover__header">
+            @if (item().icon) {
+              <fa-icon [icon]="item().icon!" class="ds-sidebar-popover__header-icon" />
+            }
+            <span class="ds-sidebar-popover__header-label">{{ item().label }}</span>
+          </div>
+
+          <!-- Liste des enfants -->
+          <div class="ds-sidebar-popover__body">
+            @for (child of item().children; track child.id; let i = $index) {
+              <div
+                class="ds-sidebar-popover__item"
+                [class.ds-sidebar-popover__item--active]="getActiveChildIndex() === i"
+                [class.ds-sidebar-popover__item--disabled]="child.disabled"
+                [attr.tabindex]="child.disabled ? -1 : 0"
+                role="menuitem"
+                [attr.aria-disabled]="child.disabled"
+                (click)="handleChildClick(child, $event)"
+                (mouseenter)="setActiveChildIndex(i)">
+
+                @if (child.icon) {
+                  <fa-icon [icon]="child.icon" class="ds-sidebar-popover__item-icon" />
+                }
+
+                <span class="ds-sidebar-popover__item-label">{{ child.label }}</span>
+
+                @if (child.badge !== undefined && child.badge !== null) {
+                  <span
+                    class="ds-sidebar-popover__item-badge"
+                    [class]="'ds-sidebar-popover__item-badge--' + (child.badgeVariant || 'default')">
+                    {{ child.badge }}
+                  </span>
+                }
+
+                @if (child.children && child.children.length > 0) {
+                  <fa-icon [icon]="chevronRightIcon" class="ds-sidebar-popover__item-chevron" />
+                }
+              </div>
+
+              @if (child.dividerAfter) {
+                <div class="ds-sidebar-popover__divider" role="separator"></div>
+              }
+            }
+          </div>
+        </div>
+      </ng-template>
+    }
+
     <!-- Enfants (récursif) -->
     @if (hasChildren() && isExpanded() && mode() !== 'collapsed') {
       <div
@@ -13929,29 +14248,35 @@ class DsSidebarItemComponent {
         }
       </div>
     }
-  `, isInline: true, styles: [":host{display:block}.ds-sidebar-item{display:flex;align-items:center;gap:var(--space-2, .5rem);min-height:var(--sidebar-item-height, 44px);padding:var(--sidebar-item-padding, .5rem 1rem);border-radius:var(--sidebar-item-radius, 6px);cursor:pointer;color:var(--sidebar-text, inherit);text-decoration:none;transition:background-color .15s ease,color .15s ease;outline:none;-webkit-user-select:none;user-select:none}.ds-sidebar-item:hover:not(.ds-sidebar-item--disabled){background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}.ds-sidebar-item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-sidebar-item--active{background:var(--sidebar-item-active-bg, rgba(59, 130, 246, .1));color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--active .ds-sidebar-item__icon{color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ds-sidebar-item--collapsed-mode{justify-content:center;padding:var(--space-2, .5rem);gap:0}.ds-sidebar-item--collapsed-mode .ds-sidebar-item__icon{margin:0}.ds-sidebar-item__toggle{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;background:transparent;color:inherit;cursor:pointer;flex-shrink:0;transition:transform .2s ease}.ds-sidebar-item__toggle:hover{color:var(--color-primary, #3b82f6)}.ds-sidebar-item__toggle-placeholder{width:20px;flex-shrink:0}.ds-sidebar-item__icon{flex-shrink:0;font-size:var(--icon-size-md, 1rem);color:var(--sidebar-icon-color, currentColor);opacity:.8}.ds-sidebar-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:inherit;font-size:var(--font-size-sm, .875rem);line-height:1.4}.ds-sidebar-item__label--router-active{font-weight:600}.ds-sidebar-item__external-icon{margin-left:var(--space-1, .25rem);font-size:.75em;opacity:.6}.ds-sidebar-item__badge{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-badge-size, 20px);height:var(--sidebar-badge-size, 20px);padding:0 var(--space-1-5, .375rem);border-radius:var(--radius-round, 9999px);font-size:var(--font-size-xs, .75rem);font-weight:600;flex-shrink:0}.ds-sidebar-item__badge--default{background:var(--gray-200, #e5e7eb);color:var(--gray-800, #1f2937)}.ds-sidebar-item__badge--primary{background:var(--color-primary, #3b82f6);color:#fff}.ds-sidebar-item__badge--success{background:var(--success, #10b981);color:#fff}.ds-sidebar-item__badge--warning{background:var(--warning, #f59e0b);color:#fff}.ds-sidebar-item__badge--error{background:var(--error, #ef4444);color:#fff}.ds-sidebar-item__badge--info{background:var(--info, #06b6d4);color:#fff}.ds-sidebar-item__divider{height:1px;margin:var(--space-2, .5rem) var(--space-4, 1rem);background:var(--sidebar-border, rgba(0, 0, 0, .1))}\n"], dependencies: [{ kind: "component", type: DsSidebarItemComponent, selector: "ds-sidebar-item", inputs: ["item", "level", "mode", "showTooltip", "expandedItemIds", "activeItemId"], outputs: ["itemClick", "itemToggle", "itemKeydown"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "directive", type: DsTooltip, selector: "[dsTooltip]", inputs: ["dsTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, styles: [":host{display:block}.ds-sidebar-item{display:flex;align-items:center;gap:var(--space-2, .5rem);min-height:var(--sidebar-item-height, 44px);padding:var(--sidebar-item-padding, .5rem 1rem);border-radius:var(--sidebar-item-radius, 6px);cursor:pointer;color:var(--sidebar-text, inherit);text-decoration:none;transition:background-color .15s ease,color .15s ease;outline:none;-webkit-user-select:none;user-select:none}.ds-sidebar-item:hover:not(.ds-sidebar-item--disabled){background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}.ds-sidebar-item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-sidebar-item--active{background:var(--sidebar-item-active-bg, rgba(59, 130, 246, .1));color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--active .ds-sidebar-item__icon{color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ds-sidebar-item--collapsed-mode{justify-content:center;padding:var(--space-2, .5rem);gap:0}.ds-sidebar-item--collapsed-mode .ds-sidebar-item__icon{margin:0}.ds-sidebar-item__toggle{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;background:transparent;color:inherit;cursor:pointer;flex-shrink:0;transition:transform .2s ease}.ds-sidebar-item__toggle:hover{color:var(--color-primary, #3b82f6)}.ds-sidebar-item__toggle-placeholder{width:20px;flex-shrink:0}.ds-sidebar-item__icon{flex-shrink:0;font-size:var(--icon-size-md, 1rem);color:var(--sidebar-icon-color, currentColor);opacity:.8}.ds-sidebar-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:inherit;font-size:var(--font-size-sm, .875rem);line-height:1.4}.ds-sidebar-item__label--router-active{font-weight:600}.ds-sidebar-item__external-icon{margin-left:var(--space-1, .25rem);font-size:.75em;opacity:.6}.ds-sidebar-item__badge{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-badge-size, 20px);height:var(--sidebar-badge-size, 20px);padding:0 var(--space-1-5, .375rem);border-radius:var(--radius-round, 9999px);font-size:var(--font-size-xs, .75rem);font-weight:600;flex-shrink:0}.ds-sidebar-item__badge--default{background:var(--gray-200, #e5e7eb);color:var(--gray-800, #1f2937)}.ds-sidebar-item__badge--primary{background:var(--color-primary, #3b82f6);color:#fff}.ds-sidebar-item__badge--success{background:var(--success, #10b981);color:#fff}.ds-sidebar-item__badge--warning{background:var(--warning, #f59e0b);color:#fff}.ds-sidebar-item__badge--error{background:var(--error, #ef4444);color:#fff}.ds-sidebar-item__badge--info{background:var(--info, #06b6d4);color:#fff}.ds-sidebar-item__divider{height:1px;margin:var(--space-2, .5rem) var(--space-4, 1rem);background:var(--sidebar-border, rgba(0, 0, 0, .1))}.ds-sidebar-popover{background:var(--popover-bg, var(--sidebar-bg, #ffffff));border:1px solid var(--popover-border, var(--sidebar-border, #e5e7eb));border-radius:var(--popover-radius, 8px);box-shadow:var(--popover-shadow, var(--shadow-2, 0 4px 6px -1px rgba(0, 0, 0, .1)));min-width:200px;max-width:280px;overflow:hidden;animation:popoverSlideIn .15s ease-out}@keyframes popoverSlideIn{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.ds-sidebar-popover__header{display:flex;align-items:center;gap:var(--space-2, .5rem);padding:var(--space-3, .75rem) var(--space-4, 1rem);background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .03));border-bottom:1px solid var(--sidebar-border, rgba(0, 0, 0, .1));font-weight:600;font-size:var(--font-size-sm, .875rem);color:var(--sidebar-text, inherit)}.ds-sidebar-popover__header-icon{font-size:var(--icon-size-md, 1rem);opacity:.8}.ds-sidebar-popover__header-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-sidebar-popover__body{padding:var(--space-1, .25rem) 0;max-height:300px;overflow-y:auto}.ds-sidebar-popover__item{display:flex;align-items:center;gap:var(--space-2, .5rem);padding:var(--space-2, .5rem) var(--space-4, 1rem);cursor:pointer;color:var(--sidebar-text, inherit);transition:background-color .15s ease;outline:none;font-size:var(--font-size-sm, .875rem)}.ds-sidebar-popover__item:hover,.ds-sidebar-popover__item--active{background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}.ds-sidebar-popover__item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-sidebar-popover__item--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ds-sidebar-popover__item-icon{flex-shrink:0;font-size:var(--icon-size-md, 1rem);opacity:.8}.ds-sidebar-popover__item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-sidebar-popover__item-badge{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-badge-size, 20px);height:var(--sidebar-badge-size, 20px);padding:0 var(--space-1-5, .375rem);border-radius:var(--radius-round, 9999px);font-size:var(--font-size-xs, .75rem);font-weight:600;flex-shrink:0}.ds-sidebar-popover__item-badge--default{background:var(--gray-200, #e5e7eb);color:var(--gray-800, #1f2937)}.ds-sidebar-popover__item-badge--primary{background:var(--color-primary, #3b82f6);color:#fff}.ds-sidebar-popover__item-badge--success{background:var(--success, #10b981);color:#fff}.ds-sidebar-popover__item-badge--warning{background:var(--warning, #f59e0b);color:#fff}.ds-sidebar-popover__item-badge--error{background:var(--error, #ef4444);color:#fff}.ds-sidebar-popover__item-badge--info{background:var(--info, #06b6d4);color:#fff}.ds-sidebar-popover__item-chevron{font-size:.75rem;opacity:.5;flex-shrink:0}.ds-sidebar-popover__divider{height:1px;margin:var(--space-1, .25rem) var(--space-4, 1rem);background:var(--sidebar-border, rgba(0, 0, 0, .1))}.ds-sidebar-item--popover-open{background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}\n"], dependencies: [{ kind: "component", type: DsSidebarItemComponent, selector: "ds-sidebar-item", inputs: ["item", "level", "mode", "showTooltip", "expandedItemIds", "activeItemId", "sidebarPosition", "collapsedTrigger"], outputs: ["itemClick", "itemToggle", "itemKeydown"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "directive", type: DsTooltip, selector: "[dsTooltip]", inputs: ["dsTooltip"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsSidebarItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ds-sidebar-item', standalone: true, imports: [CommonModule, RouterModule, FontAwesomeModule, DsTooltip], template: `
+            args: [{ selector: 'ds-sidebar-item', standalone: true, imports: [CommonModule, RouterModule, FontAwesomeModule, DsTooltip, CdkConnectedOverlay, CdkOverlayOrigin], template: `
     <!-- Item container -->
     <div
+      #itemTrigger="cdkOverlayOrigin"
+      cdkOverlayOrigin
       class="ds-sidebar-item"
       [class.ds-sidebar-item--active]="isActive()"
       [class.ds-sidebar-item--disabled]="item().disabled"
       [class.ds-sidebar-item--has-children]="hasChildren()"
       [class.ds-sidebar-item--expanded]="isExpanded()"
       [class.ds-sidebar-item--collapsed-mode]="mode() === 'collapsed'"
+      [class.ds-sidebar-item--popover-open]="isPopoverOpen()"
       [style.padding-left.px]="mode() === 'collapsed' ? null : indentPadding()"
       [attr.tabindex]="item().disabled ? -1 : 0"
       role="menuitem"
-      [attr.aria-expanded]="hasChildren() ? isExpanded() : null"
+      [attr.aria-haspopup]="hasChildren() && mode() === 'collapsed' ? 'menu' : null"
+      [attr.aria-expanded]="hasChildren() ? (mode() === 'collapsed' ? isPopoverOpen() : isExpanded()) : null"
       [attr.aria-selected]="isActive()"
       [attr.aria-disabled]="item().disabled"
       [attr.data-item-id]="item().id"
       (click)="handleClick($event)"
       (keydown)="handleKeydown($event)"
-      [dsTooltip]="mode() === 'collapsed' && showTooltip() ? item().label : ''"
+      (mouseenter)="handleMouseEnter()"
+      (mouseleave)="handleMouseLeave()"
+      [dsTooltip]="mode() === 'collapsed' && showTooltip() && !isPopoverOpen() && !hasChildren() ? item().label : ''"
       tooltipPosition="right"
       #itemElement>
 
@@ -14018,6 +14343,76 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
       <div class="ds-sidebar-item__divider" role="separator"></div>
     }
 
+    <!-- Popover pour enfants en mode collapsed -->
+    @if (hasChildren() && mode() === 'collapsed') {
+      <ng-template
+        cdkConnectedOverlay
+        [cdkConnectedOverlayOrigin]="itemTrigger"
+        [cdkConnectedOverlayOpen]="isPopoverOpen()"
+        [cdkConnectedOverlayPositions]="popoverPositions()"
+        [cdkConnectedOverlayHasBackdrop]="true"
+        [cdkConnectedOverlayBackdropClass]="'ds-sidebar-popover-backdrop'"
+        [cdkConnectedOverlayPanelClass]="'ds-sidebar-popover-panel'"
+        (backdropClick)="closePopover()"
+        (detach)="closePopover()">
+
+        <div
+          class="ds-sidebar-popover"
+          role="menu"
+          [attr.aria-label]="'Sous-menu de ' + item().label"
+          (keydown)="handlePopoverKeydown($event)"
+          (mouseenter)="handlePopoverMouseEnter()"
+          (mouseleave)="handlePopoverMouseLeave()">
+
+          <!-- Header du popover avec le label parent -->
+          <div class="ds-sidebar-popover__header">
+            @if (item().icon) {
+              <fa-icon [icon]="item().icon!" class="ds-sidebar-popover__header-icon" />
+            }
+            <span class="ds-sidebar-popover__header-label">{{ item().label }}</span>
+          </div>
+
+          <!-- Liste des enfants -->
+          <div class="ds-sidebar-popover__body">
+            @for (child of item().children; track child.id; let i = $index) {
+              <div
+                class="ds-sidebar-popover__item"
+                [class.ds-sidebar-popover__item--active]="getActiveChildIndex() === i"
+                [class.ds-sidebar-popover__item--disabled]="child.disabled"
+                [attr.tabindex]="child.disabled ? -1 : 0"
+                role="menuitem"
+                [attr.aria-disabled]="child.disabled"
+                (click)="handleChildClick(child, $event)"
+                (mouseenter)="setActiveChildIndex(i)">
+
+                @if (child.icon) {
+                  <fa-icon [icon]="child.icon" class="ds-sidebar-popover__item-icon" />
+                }
+
+                <span class="ds-sidebar-popover__item-label">{{ child.label }}</span>
+
+                @if (child.badge !== undefined && child.badge !== null) {
+                  <span
+                    class="ds-sidebar-popover__item-badge"
+                    [class]="'ds-sidebar-popover__item-badge--' + (child.badgeVariant || 'default')">
+                    {{ child.badge }}
+                  </span>
+                }
+
+                @if (child.children && child.children.length > 0) {
+                  <fa-icon [icon]="chevronRightIcon" class="ds-sidebar-popover__item-chevron" />
+                }
+              </div>
+
+              @if (child.dividerAfter) {
+                <div class="ds-sidebar-popover__divider" role="separator"></div>
+              }
+            }
+          </div>
+        </div>
+      </ng-template>
+    }
+
     <!-- Enfants (récursif) -->
     @if (hasChildren() && isExpanded() && mode() !== 'collapsed') {
       <div
@@ -14038,8 +14433,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
         }
       </div>
     }
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}.ds-sidebar-item{display:flex;align-items:center;gap:var(--space-2, .5rem);min-height:var(--sidebar-item-height, 44px);padding:var(--sidebar-item-padding, .5rem 1rem);border-radius:var(--sidebar-item-radius, 6px);cursor:pointer;color:var(--sidebar-text, inherit);text-decoration:none;transition:background-color .15s ease,color .15s ease;outline:none;-webkit-user-select:none;user-select:none}.ds-sidebar-item:hover:not(.ds-sidebar-item--disabled){background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}.ds-sidebar-item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-sidebar-item--active{background:var(--sidebar-item-active-bg, rgba(59, 130, 246, .1));color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--active .ds-sidebar-item__icon{color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ds-sidebar-item--collapsed-mode{justify-content:center;padding:var(--space-2, .5rem);gap:0}.ds-sidebar-item--collapsed-mode .ds-sidebar-item__icon{margin:0}.ds-sidebar-item__toggle{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;background:transparent;color:inherit;cursor:pointer;flex-shrink:0;transition:transform .2s ease}.ds-sidebar-item__toggle:hover{color:var(--color-primary, #3b82f6)}.ds-sidebar-item__toggle-placeholder{width:20px;flex-shrink:0}.ds-sidebar-item__icon{flex-shrink:0;font-size:var(--icon-size-md, 1rem);color:var(--sidebar-icon-color, currentColor);opacity:.8}.ds-sidebar-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:inherit;font-size:var(--font-size-sm, .875rem);line-height:1.4}.ds-sidebar-item__label--router-active{font-weight:600}.ds-sidebar-item__external-icon{margin-left:var(--space-1, .25rem);font-size:.75em;opacity:.6}.ds-sidebar-item__badge{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-badge-size, 20px);height:var(--sidebar-badge-size, 20px);padding:0 var(--space-1-5, .375rem);border-radius:var(--radius-round, 9999px);font-size:var(--font-size-xs, .75rem);font-weight:600;flex-shrink:0}.ds-sidebar-item__badge--default{background:var(--gray-200, #e5e7eb);color:var(--gray-800, #1f2937)}.ds-sidebar-item__badge--primary{background:var(--color-primary, #3b82f6);color:#fff}.ds-sidebar-item__badge--success{background:var(--success, #10b981);color:#fff}.ds-sidebar-item__badge--warning{background:var(--warning, #f59e0b);color:#fff}.ds-sidebar-item__badge--error{background:var(--error, #ef4444);color:#fff}.ds-sidebar-item__badge--info{background:var(--info, #06b6d4);color:#fff}.ds-sidebar-item__divider{height:1px;margin:var(--space-2, .5rem) var(--space-4, 1rem);background:var(--sidebar-border, rgba(0, 0, 0, .1))}\n"] }]
-        }], propDecorators: { item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: true }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], showTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTooltip", required: false }] }], expandedItemIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedItemIds", required: false }] }], activeItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeItemId", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], itemToggle: [{ type: i0.Output, args: ["itemToggle"] }], itemKeydown: [{ type: i0.Output, args: ["itemKeydown"] }] } });
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}.ds-sidebar-item{display:flex;align-items:center;gap:var(--space-2, .5rem);min-height:var(--sidebar-item-height, 44px);padding:var(--sidebar-item-padding, .5rem 1rem);border-radius:var(--sidebar-item-radius, 6px);cursor:pointer;color:var(--sidebar-text, inherit);text-decoration:none;transition:background-color .15s ease,color .15s ease;outline:none;-webkit-user-select:none;user-select:none}.ds-sidebar-item:hover:not(.ds-sidebar-item--disabled){background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}.ds-sidebar-item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-sidebar-item--active{background:var(--sidebar-item-active-bg, rgba(59, 130, 246, .1));color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--active .ds-sidebar-item__icon{color:var(--sidebar-item-active-text, #3b82f6)}.ds-sidebar-item--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ds-sidebar-item--collapsed-mode{justify-content:center;padding:var(--space-2, .5rem);gap:0}.ds-sidebar-item--collapsed-mode .ds-sidebar-item__icon{margin:0}.ds-sidebar-item__toggle{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;background:transparent;color:inherit;cursor:pointer;flex-shrink:0;transition:transform .2s ease}.ds-sidebar-item__toggle:hover{color:var(--color-primary, #3b82f6)}.ds-sidebar-item__toggle-placeholder{width:20px;flex-shrink:0}.ds-sidebar-item__icon{flex-shrink:0;font-size:var(--icon-size-md, 1rem);color:var(--sidebar-icon-color, currentColor);opacity:.8}.ds-sidebar-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:inherit;font-size:var(--font-size-sm, .875rem);line-height:1.4}.ds-sidebar-item__label--router-active{font-weight:600}.ds-sidebar-item__external-icon{margin-left:var(--space-1, .25rem);font-size:.75em;opacity:.6}.ds-sidebar-item__badge{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-badge-size, 20px);height:var(--sidebar-badge-size, 20px);padding:0 var(--space-1-5, .375rem);border-radius:var(--radius-round, 9999px);font-size:var(--font-size-xs, .75rem);font-weight:600;flex-shrink:0}.ds-sidebar-item__badge--default{background:var(--gray-200, #e5e7eb);color:var(--gray-800, #1f2937)}.ds-sidebar-item__badge--primary{background:var(--color-primary, #3b82f6);color:#fff}.ds-sidebar-item__badge--success{background:var(--success, #10b981);color:#fff}.ds-sidebar-item__badge--warning{background:var(--warning, #f59e0b);color:#fff}.ds-sidebar-item__badge--error{background:var(--error, #ef4444);color:#fff}.ds-sidebar-item__badge--info{background:var(--info, #06b6d4);color:#fff}.ds-sidebar-item__divider{height:1px;margin:var(--space-2, .5rem) var(--space-4, 1rem);background:var(--sidebar-border, rgba(0, 0, 0, .1))}.ds-sidebar-popover{background:var(--popover-bg, var(--sidebar-bg, #ffffff));border:1px solid var(--popover-border, var(--sidebar-border, #e5e7eb));border-radius:var(--popover-radius, 8px);box-shadow:var(--popover-shadow, var(--shadow-2, 0 4px 6px -1px rgba(0, 0, 0, .1)));min-width:200px;max-width:280px;overflow:hidden;animation:popoverSlideIn .15s ease-out}@keyframes popoverSlideIn{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.ds-sidebar-popover__header{display:flex;align-items:center;gap:var(--space-2, .5rem);padding:var(--space-3, .75rem) var(--space-4, 1rem);background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .03));border-bottom:1px solid var(--sidebar-border, rgba(0, 0, 0, .1));font-weight:600;font-size:var(--font-size-sm, .875rem);color:var(--sidebar-text, inherit)}.ds-sidebar-popover__header-icon{font-size:var(--icon-size-md, 1rem);opacity:.8}.ds-sidebar-popover__header-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-sidebar-popover__body{padding:var(--space-1, .25rem) 0;max-height:300px;overflow-y:auto}.ds-sidebar-popover__item{display:flex;align-items:center;gap:var(--space-2, .5rem);padding:var(--space-2, .5rem) var(--space-4, 1rem);cursor:pointer;color:var(--sidebar-text, inherit);transition:background-color .15s ease;outline:none;font-size:var(--font-size-sm, .875rem)}.ds-sidebar-popover__item:hover,.ds-sidebar-popover__item--active{background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}.ds-sidebar-popover__item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-sidebar-popover__item--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ds-sidebar-popover__item-icon{flex-shrink:0;font-size:var(--icon-size-md, 1rem);opacity:.8}.ds-sidebar-popover__item-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-sidebar-popover__item-badge{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-badge-size, 20px);height:var(--sidebar-badge-size, 20px);padding:0 var(--space-1-5, .375rem);border-radius:var(--radius-round, 9999px);font-size:var(--font-size-xs, .75rem);font-weight:600;flex-shrink:0}.ds-sidebar-popover__item-badge--default{background:var(--gray-200, #e5e7eb);color:var(--gray-800, #1f2937)}.ds-sidebar-popover__item-badge--primary{background:var(--color-primary, #3b82f6);color:#fff}.ds-sidebar-popover__item-badge--success{background:var(--success, #10b981);color:#fff}.ds-sidebar-popover__item-badge--warning{background:var(--warning, #f59e0b);color:#fff}.ds-sidebar-popover__item-badge--error{background:var(--error, #ef4444);color:#fff}.ds-sidebar-popover__item-badge--info{background:var(--info, #06b6d4);color:#fff}.ds-sidebar-popover__item-chevron{font-size:.75rem;opacity:.5;flex-shrink:0}.ds-sidebar-popover__divider{height:1px;margin:var(--space-1, .25rem) var(--space-4, 1rem);background:var(--sidebar-border, rgba(0, 0, 0, .1))}.ds-sidebar-item--popover-open{background:var(--sidebar-item-hover-bg, rgba(0, 0, 0, .05))}\n"] }]
+        }], propDecorators: { item: [{ type: i0.Input, args: [{ isSignal: true, alias: "item", required: true }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], showTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTooltip", required: false }] }], expandedItemIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedItemIds", required: false }] }], activeItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeItemId", required: false }] }], sidebarPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarPosition", required: false }] }], collapsedTrigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsedTrigger", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], itemToggle: [{ type: i0.Output, args: ["itemToggle"] }], itemKeydown: [{ type: i0.Output, args: ["itemKeydown"] }] } });
 
 /**
  * # DsSidebar
@@ -14100,6 +14495,8 @@ class DsSidebar {
     autoCollapseOnMobile = input(true, ...(ngDevMode ? [{ debugName: "autoCollapseOnMobile" }] : []));
     /** Affiche les tooltips en mode collapsed (désactivable) */
     showTooltips = input(true, ...(ngDevMode ? [{ debugName: "showTooltips" }] : []));
+    /** Trigger pour ouvrir le popover des sous-menus en mode collapsed */
+    collapsedTrigger = input('hover', ...(ngDevMode ? [{ debugName: "collapsedTrigger" }] : []));
     /** ID de l'item actif (contrôlé depuis l'extérieur) */
     initialActiveItemId = input(null, ...(ngDevMode ? [{ debugName: "initialActiveItemId" }] : []));
     // ============ OUTPUTS ============
@@ -14592,12 +14989,12 @@ class DsSidebar {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsSidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsSidebar, isStandalone: true, selector: "ds-sidebar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, responsiveBreakpoint: { classPropertyName: "responsiveBreakpoint", publicName: "responsiveBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, autoCollapseOnMobile: { classPropertyName: "autoCollapseOnMobile", publicName: "autoCollapseOnMobile", isSignal: true, isRequired: false, transformFunction: null }, showTooltips: { classPropertyName: "showTooltips", publicName: "showTooltips", isSignal: true, isRequired: false, transformFunction: null }, initialActiveItemId: { classPropertyName: "initialActiveItemId", publicName: "initialActiveItemId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", itemExpand: "itemExpand", modeChange: "modeChange", overlayOpened: "overlayOpened", overlayClosed: "overlayClosed" }, viewQueries: [{ propertyName: "sidebarContainer", first: true, predicate: ["sidebarContainer"], descendants: true }, { propertyName: "itemComponents", predicate: DsSidebarItemComponent, descendants: true }], ngImport: i0, template: "<!-- Backdrop (mode overlay) -->\n@if (internalMode() === 'overlay' && isOverlayOpen()) {\n  <div\n    class=\"ds-sidebar__backdrop\"\n    (click)=\"handleBackdropClick()\"\n    aria-hidden=\"true\">\n  </div>\n}\n\n<!-- Sidebar container -->\n<nav\n  #sidebarContainer\n  [class]=\"containerClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  role=\"navigation\"\n  (keydown)=\"handleKeyDown($event)\">\n\n  <!-- Header -->\n  <div class=\"ds-sidebar__header\">\n    <ng-content select=\"[sidebar-header]\"></ng-content>\n\n    <!-- Toggle button -->\n    @if (collapsible() && internalMode() !== 'overlay') {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__toggle-btn\"\n        [attr.aria-label]=\"internalMode() === 'collapsed' ? 'D\u00E9velopper la sidebar' : 'R\u00E9duire la sidebar'\"\n        [attr.aria-expanded]=\"internalMode() === 'full'\"\n        (click)=\"toggleMode()\">\n        <fa-icon [icon]=\"internalMode() === 'collapsed' ? expandIcon : collapseIcon\" />\n      </button>\n    }\n\n    <!-- Close button (overlay mode) -->\n    @if (internalMode() === 'overlay' && isOverlayOpen()) {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__close-btn\"\n        aria-label=\"Fermer le menu\"\n        (click)=\"closeOverlay()\">\n        <fa-icon [icon]=\"collapseIcon\" />\n      </button>\n    }\n  </div>\n\n  <!-- Body (items) -->\n  <div class=\"ds-sidebar__body\" role=\"menubar\" aria-orientation=\"vertical\">\n    @for (item of items(); track item.id) {\n      <ds-sidebar-item\n        [item]=\"item\"\n        [level]=\"0\"\n        [mode]=\"internalMode()\"\n        [showTooltip]=\"showTooltips()\"\n        [expandedItemIds]=\"expandedItemIds()\"\n        [activeItemId]=\"activeItemId()\"\n        (itemClick)=\"handleItemClick($event)\"\n        (itemToggle)=\"handleItemToggle($event)\"\n        (itemKeydown)=\"handleItemKeydown($event)\" />\n    }\n  </div>\n\n  <!-- Footer -->\n  <div class=\"ds-sidebar__footer\">\n    <ng-content select=\"[sidebar-footer]\"></ng-content>\n  </div>\n</nav>\n\n<!-- Trigger button (overlay mode, quand ferm\u00E9) -->\n@if (internalMode() === 'overlay' && !isOverlayOpen()) {\n  <button\n    type=\"button\"\n    class=\"ds-sidebar__trigger\"\n    [class.ds-sidebar__trigger--left]=\"position() === 'left'\"\n    [class.ds-sidebar__trigger--right]=\"position() === 'right'\"\n    aria-label=\"Ouvrir le menu\"\n    aria-haspopup=\"menu\"\n    [attr.aria-expanded]=\"isOverlayOpen()\"\n    (click)=\"openOverlay()\">\n    <fa-icon [icon]=\"menuIcon\" />\n  </button>\n}\n", styles: [":host{display:block}.ds-sidebar__backdrop{position:fixed;inset:0;background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .5));z-index:var(--z-index-full, 9999);opacity:0;animation:fadeIn var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ds-sidebar{display:flex;flex-direction:column;height:100vh;background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));transition:width var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease,transform var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease}.ds-sidebar--left{border-right:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--right{border-left:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--full{width:var(--sidebar-width-md, 240px)}.ds-sidebar--full.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--full.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar--collapsed{width:var(--sidebar-width-collapsed, 64px)}.ds-sidebar--collapsed .ds-sidebar__header,.ds-sidebar--collapsed .ds-sidebar__footer{padding:var(--space-2, .5rem);justify-content:center}.ds-sidebar--collapsed .ds-sidebar__toggle-btn{margin:0 auto}.ds-sidebar--overlay{position:fixed;top:0;bottom:0;z-index:var(--z-index-full, 9999);box-shadow:var(--sidebar-shadow, var(--shadow-3, 0 10px 25px rgba(0, 0, 0, .1)));transform:translate(-100%);width:var(--sidebar-width-md, 240px)}.ds-sidebar--overlay.ds-sidebar--left{left:0}.ds-sidebar--overlay.ds-sidebar--right{right:0;transform:translate(100%)}.ds-sidebar--overlay.ds-sidebar--overlay-open{transform:translate(0)}.ds-sidebar--overlay.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--overlay.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sidebar-header-padding, var(--space-4, 1rem));border-bottom:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0;min-height:60px;position:relative;z-index:1}:host ::ng-deep .ds-sidebar__header img{max-height:32px;width:auto}:host ::ng-deep .ds-sidebar__header h1,:host ::ng-deep .ds-sidebar__header h2,:host ::ng-deep .ds-sidebar__header h3{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__header .ds-sidebar-logo{max-height:32px;width:auto}.ds-sidebar__header .ds-sidebar-title{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__toggle-btn,.ds-sidebar__close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px));background:transparent;color:var(--sidebar-text, var(--text-default, #1f2937));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,color var(--duration-fast, .15s) ease;flex-shrink:0}.ds-sidebar__toggle-btn:hover,.ds-sidebar__close-btn:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__toggle-btn:focus-visible,.ds-sidebar__close-btn:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__body{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--sidebar-body-padding, var(--space-2, .5rem))}.ds-sidebar__body::-webkit-scrollbar{width:6px}.ds-sidebar__body::-webkit-scrollbar-track{background:transparent}.ds-sidebar__body::-webkit-scrollbar-thumb{background:var(--sidebar-scrollbar-thumb, var(--gray-300, #d1d5db));border-radius:3px}.ds-sidebar__body::-webkit-scrollbar-thumb:hover{background:var(--sidebar-scrollbar-thumb-hover, var(--gray-400, #9ca3af))}.ds-sidebar__footer{padding:var(--sidebar-footer-padding, var(--space-4, 1rem));border-top:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0}.ds-sidebar__footer:empty{display:none}:host ::ng-deep .ds-sidebar__footer button{width:100%}.ds-sidebar__footer .ds-sidebar-footer-btn{width:100%}.ds-sidebar__trigger{position:fixed;top:var(--space-4, 1rem);z-index:var(--z-index-3, 998);display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;border-radius:var(--radius-2, 8px);background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));box-shadow:var(--sidebar-trigger-shadow, var(--shadow-2, 0 4px 12px rgba(0, 0, 0, .1)));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,transform var(--duration-fast, .15s) ease}.ds-sidebar__trigger--left{left:var(--space-4, 1rem)}.ds-sidebar__trigger--right{right:var(--space-4, 1rem)}.ds-sidebar__trigger:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__trigger:active{transform:scale(.95)}.ds-sidebar__trigger:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}:host-context(.theme-dark) .ds-sidebar{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}:host-context(.theme-dark) .ds-sidebar__backdrop{background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .7))}:host-context(.theme-dark) .ds-sidebar__trigger{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media print{.ds-sidebar,.ds-sidebar__backdrop,.ds-sidebar__trigger{display:none!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "component", type: DsSidebarItemComponent, selector: "ds-sidebar-item", inputs: ["item", "level", "mode", "showTooltip", "expandedItemIds", "activeItemId"], outputs: ["itemClick", "itemToggle", "itemKeydown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsSidebar, isStandalone: true, selector: "ds-sidebar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, responsiveBreakpoint: { classPropertyName: "responsiveBreakpoint", publicName: "responsiveBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, autoCollapseOnMobile: { classPropertyName: "autoCollapseOnMobile", publicName: "autoCollapseOnMobile", isSignal: true, isRequired: false, transformFunction: null }, showTooltips: { classPropertyName: "showTooltips", publicName: "showTooltips", isSignal: true, isRequired: false, transformFunction: null }, collapsedTrigger: { classPropertyName: "collapsedTrigger", publicName: "collapsedTrigger", isSignal: true, isRequired: false, transformFunction: null }, initialActiveItemId: { classPropertyName: "initialActiveItemId", publicName: "initialActiveItemId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", itemExpand: "itemExpand", modeChange: "modeChange", overlayOpened: "overlayOpened", overlayClosed: "overlayClosed" }, viewQueries: [{ propertyName: "sidebarContainer", first: true, predicate: ["sidebarContainer"], descendants: true }, { propertyName: "itemComponents", predicate: DsSidebarItemComponent, descendants: true }], ngImport: i0, template: "<!-- Backdrop (mode overlay) -->\n@if (internalMode() === 'overlay' && isOverlayOpen()) {\n  <div\n    class=\"ds-sidebar__backdrop\"\n    (click)=\"handleBackdropClick()\"\n    aria-hidden=\"true\">\n  </div>\n}\n\n<!-- Sidebar container -->\n<nav\n  #sidebarContainer\n  [class]=\"containerClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  role=\"navigation\"\n  (keydown)=\"handleKeyDown($event)\">\n\n  <!-- Header -->\n  <div class=\"ds-sidebar__header\">\n    <ng-content select=\"[sidebar-header]\"></ng-content>\n\n    <!-- Toggle button -->\n    @if (collapsible() && internalMode() !== 'overlay') {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__toggle-btn\"\n        [attr.aria-label]=\"internalMode() === 'collapsed' ? 'D\u00E9velopper la sidebar' : 'R\u00E9duire la sidebar'\"\n        [attr.aria-expanded]=\"internalMode() === 'full'\"\n        (click)=\"toggleMode()\">\n        <fa-icon [icon]=\"internalMode() === 'collapsed' ? expandIcon : collapseIcon\" />\n      </button>\n    }\n\n    <!-- Close button (overlay mode) -->\n    @if (internalMode() === 'overlay' && isOverlayOpen()) {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__close-btn\"\n        aria-label=\"Fermer le menu\"\n        (click)=\"closeOverlay()\">\n        <fa-icon [icon]=\"collapseIcon\" />\n      </button>\n    }\n  </div>\n\n  <!-- Body (items) -->\n  <div class=\"ds-sidebar__body\" role=\"menubar\" aria-orientation=\"vertical\">\n    @for (item of items(); track item.id) {\n      <ds-sidebar-item\n        [item]=\"item\"\n        [level]=\"0\"\n        [mode]=\"internalMode()\"\n        [showTooltip]=\"showTooltips()\"\n        [sidebarPosition]=\"position()\"\n        [collapsedTrigger]=\"collapsedTrigger()\"\n        [expandedItemIds]=\"expandedItemIds()\"\n        [activeItemId]=\"activeItemId()\"\n        (itemClick)=\"handleItemClick($event)\"\n        (itemToggle)=\"handleItemToggle($event)\"\n        (itemKeydown)=\"handleItemKeydown($event)\" />\n    }\n  </div>\n\n  <!-- Footer -->\n  <div class=\"ds-sidebar__footer\">\n    <ng-content select=\"[sidebar-footer]\"></ng-content>\n  </div>\n</nav>\n\n<!-- Bouton expand (mode collapsed uniquement) - \u00E0 l'ext\u00E9rieur du nav pour \u00E9viter overflow:hidden -->\n@if (collapsible() && internalMode() === 'collapsed') {\n  <button\n    type=\"button\"\n    class=\"ds-sidebar__expand-btn\"\n    [class.ds-sidebar__expand-btn--left]=\"position() === 'right'\"\n    aria-label=\"D\u00E9velopper la sidebar\"\n    (click)=\"toggleMode()\">\n    <fa-icon [icon]=\"expandIcon\" />\n  </button>\n}\n\n<!-- Trigger button (overlay mode, quand ferm\u00E9) -->\n@if (internalMode() === 'overlay' && !isOverlayOpen()) {\n  <button\n    type=\"button\"\n    class=\"ds-sidebar__trigger\"\n    [class.ds-sidebar__trigger--left]=\"position() === 'left'\"\n    [class.ds-sidebar__trigger--right]=\"position() === 'right'\"\n    aria-label=\"Ouvrir le menu\"\n    aria-haspopup=\"menu\"\n    [attr.aria-expanded]=\"isOverlayOpen()\"\n    (click)=\"openOverlay()\">\n    <fa-icon [icon]=\"menuIcon\" />\n  </button>\n}\n", styles: [":host{display:flex;position:relative;height:100%}.ds-sidebar__backdrop{position:fixed;inset:0;background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .5));z-index:var(--z-index-full, 9999);opacity:0;animation:fadeIn var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ds-sidebar{display:flex;flex-direction:column;height:100%;position:relative;overflow:hidden;background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));transition:width var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease,transform var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease}.ds-sidebar--left{border-right:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--right{border-left:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--full{width:var(--sidebar-width-md, 240px)}.ds-sidebar--full.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--full.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar--collapsed{width:var(--sidebar-width-collapsed, 64px)}.ds-sidebar--collapsed .ds-sidebar__header,.ds-sidebar--collapsed .ds-sidebar__footer{padding:var(--space-2, .5rem);justify-content:center}.ds-sidebar--collapsed .ds-sidebar__toggle-btn{display:none}.ds-sidebar--overlay{position:fixed;top:0;bottom:0;z-index:var(--z-index-full, 9999);box-shadow:var(--sidebar-shadow, var(--shadow-3, 0 10px 25px rgba(0, 0, 0, .1)));transform:translate(-100%);width:var(--sidebar-width-md, 240px)}.ds-sidebar--overlay.ds-sidebar--left{left:0}.ds-sidebar--overlay.ds-sidebar--right{right:0;transform:translate(100%)}.ds-sidebar--overlay.ds-sidebar--overlay-open{transform:translate(0)}.ds-sidebar--overlay.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--overlay.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sidebar-header-padding, var(--space-4, 1rem));border-bottom:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0;min-height:60px;position:relative;z-index:1}:host ::ng-deep .ds-sidebar__header img{max-height:32px;width:auto}:host ::ng-deep .ds-sidebar__header h1,:host ::ng-deep .ds-sidebar__header h2,:host ::ng-deep .ds-sidebar__header h3{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__header .ds-sidebar-logo{max-height:32px;width:auto}.ds-sidebar__header .ds-sidebar-title{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__toggle-btn,.ds-sidebar__close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px));background:transparent;color:var(--sidebar-text, var(--text-default, #1f2937));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,color var(--duration-fast, .15s) ease;flex-shrink:0}.ds-sidebar__toggle-btn:hover,.ds-sidebar__close-btn:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__toggle-btn:focus-visible,.ds-sidebar__close-btn:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__body{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--sidebar-body-padding, var(--space-2, .5rem))}.ds-sidebar__body::-webkit-scrollbar{width:6px}.ds-sidebar__body::-webkit-scrollbar-track{background:transparent}.ds-sidebar__body::-webkit-scrollbar-thumb{background:var(--sidebar-scrollbar-thumb, var(--gray-300, #d1d5db));border-radius:3px}.ds-sidebar__body::-webkit-scrollbar-thumb:hover{background:var(--sidebar-scrollbar-thumb-hover, var(--gray-400, #9ca3af))}.ds-sidebar__footer{padding:var(--sidebar-footer-padding, var(--space-4, 1rem));border-top:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0}.ds-sidebar__footer:empty{display:none}:host ::ng-deep .ds-sidebar__footer button{width:100%}.ds-sidebar__footer .ds-sidebar-footer-btn{width:100%}.ds-sidebar__trigger{position:fixed;top:var(--space-4, 1rem);z-index:var(--z-index-3, 998);display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;border-radius:var(--radius-2, 8px);background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));box-shadow:var(--sidebar-trigger-shadow, var(--shadow-2, 0 4px 12px rgba(0, 0, 0, .1)));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,transform var(--duration-fast, .15s) ease}.ds-sidebar__trigger--left{left:var(--space-4, 1rem)}.ds-sidebar__trigger--right{right:var(--space-4, 1rem)}.ds-sidebar__trigger:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__trigger:active{transform:scale(.95)}.ds-sidebar__trigger:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__expand-btn{position:absolute;top:50%;left:var(--sidebar-width-collapsed, 64px);transform:translateY(-50%) translate(-50%);display:flex;align-items:center;justify-content:center;width:24px;height:48px;padding:0;border:none;border-radius:0 var(--sidebar-item-radius, var(--radius-1-5, 6px)) var(--sidebar-item-radius, var(--radius-1-5, 6px)) 0;background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));cursor:pointer;box-shadow:var(--shadow-2, 0 4px 12px rgba(0, 0, 0, .1));z-index:2;transition:background-color var(--duration-fast, .15s) ease}.ds-sidebar__expand-btn:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__expand-btn:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__expand-btn--left{left:auto;right:var(--sidebar-width-collapsed, 64px);transform:translateY(-50%) translate(50%);border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px)) 0 0 var(--sidebar-item-radius, var(--radius-1-5, 6px))}:host-context(.theme-dark) .ds-sidebar{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}:host-context(.theme-dark) .ds-sidebar__backdrop{background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .7))}:host-context(.theme-dark) .ds-sidebar__trigger,:host-context(.theme-dark) .ds-sidebar__expand-btn{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media print{.ds-sidebar,.ds-sidebar__backdrop,.ds-sidebar__trigger{display:none!important}}::ng-deep .ds-sidebar-popover-backdrop{background:transparent}::ng-deep .ds-sidebar-popover-panel{z-index:var(--z-index-3, 1000)}:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .ds-sidebar-logo-text,:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .logo-text{display:none}:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .ds-sidebar-logo-icon,:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .logo-icon{margin:0 auto}:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .sidebar-logo{padding:0;justify-content:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "component", type: DsSidebarItemComponent, selector: "ds-sidebar-item", inputs: ["item", "level", "mode", "showTooltip", "expandedItemIds", "activeItemId", "sidebarPosition", "collapsedTrigger"], outputs: ["itemClick", "itemToggle", "itemKeydown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsSidebar, decorators: [{
             type: Component,
-            args: [{ selector: 'ds-sidebar', standalone: true, imports: [CommonModule, FontAwesomeModule, DsSidebarItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Backdrop (mode overlay) -->\n@if (internalMode() === 'overlay' && isOverlayOpen()) {\n  <div\n    class=\"ds-sidebar__backdrop\"\n    (click)=\"handleBackdropClick()\"\n    aria-hidden=\"true\">\n  </div>\n}\n\n<!-- Sidebar container -->\n<nav\n  #sidebarContainer\n  [class]=\"containerClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  role=\"navigation\"\n  (keydown)=\"handleKeyDown($event)\">\n\n  <!-- Header -->\n  <div class=\"ds-sidebar__header\">\n    <ng-content select=\"[sidebar-header]\"></ng-content>\n\n    <!-- Toggle button -->\n    @if (collapsible() && internalMode() !== 'overlay') {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__toggle-btn\"\n        [attr.aria-label]=\"internalMode() === 'collapsed' ? 'D\u00E9velopper la sidebar' : 'R\u00E9duire la sidebar'\"\n        [attr.aria-expanded]=\"internalMode() === 'full'\"\n        (click)=\"toggleMode()\">\n        <fa-icon [icon]=\"internalMode() === 'collapsed' ? expandIcon : collapseIcon\" />\n      </button>\n    }\n\n    <!-- Close button (overlay mode) -->\n    @if (internalMode() === 'overlay' && isOverlayOpen()) {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__close-btn\"\n        aria-label=\"Fermer le menu\"\n        (click)=\"closeOverlay()\">\n        <fa-icon [icon]=\"collapseIcon\" />\n      </button>\n    }\n  </div>\n\n  <!-- Body (items) -->\n  <div class=\"ds-sidebar__body\" role=\"menubar\" aria-orientation=\"vertical\">\n    @for (item of items(); track item.id) {\n      <ds-sidebar-item\n        [item]=\"item\"\n        [level]=\"0\"\n        [mode]=\"internalMode()\"\n        [showTooltip]=\"showTooltips()\"\n        [expandedItemIds]=\"expandedItemIds()\"\n        [activeItemId]=\"activeItemId()\"\n        (itemClick)=\"handleItemClick($event)\"\n        (itemToggle)=\"handleItemToggle($event)\"\n        (itemKeydown)=\"handleItemKeydown($event)\" />\n    }\n  </div>\n\n  <!-- Footer -->\n  <div class=\"ds-sidebar__footer\">\n    <ng-content select=\"[sidebar-footer]\"></ng-content>\n  </div>\n</nav>\n\n<!-- Trigger button (overlay mode, quand ferm\u00E9) -->\n@if (internalMode() === 'overlay' && !isOverlayOpen()) {\n  <button\n    type=\"button\"\n    class=\"ds-sidebar__trigger\"\n    [class.ds-sidebar__trigger--left]=\"position() === 'left'\"\n    [class.ds-sidebar__trigger--right]=\"position() === 'right'\"\n    aria-label=\"Ouvrir le menu\"\n    aria-haspopup=\"menu\"\n    [attr.aria-expanded]=\"isOverlayOpen()\"\n    (click)=\"openOverlay()\">\n    <fa-icon [icon]=\"menuIcon\" />\n  </button>\n}\n", styles: [":host{display:block}.ds-sidebar__backdrop{position:fixed;inset:0;background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .5));z-index:var(--z-index-full, 9999);opacity:0;animation:fadeIn var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ds-sidebar{display:flex;flex-direction:column;height:100vh;background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));transition:width var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease,transform var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease}.ds-sidebar--left{border-right:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--right{border-left:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--full{width:var(--sidebar-width-md, 240px)}.ds-sidebar--full.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--full.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar--collapsed{width:var(--sidebar-width-collapsed, 64px)}.ds-sidebar--collapsed .ds-sidebar__header,.ds-sidebar--collapsed .ds-sidebar__footer{padding:var(--space-2, .5rem);justify-content:center}.ds-sidebar--collapsed .ds-sidebar__toggle-btn{margin:0 auto}.ds-sidebar--overlay{position:fixed;top:0;bottom:0;z-index:var(--z-index-full, 9999);box-shadow:var(--sidebar-shadow, var(--shadow-3, 0 10px 25px rgba(0, 0, 0, .1)));transform:translate(-100%);width:var(--sidebar-width-md, 240px)}.ds-sidebar--overlay.ds-sidebar--left{left:0}.ds-sidebar--overlay.ds-sidebar--right{right:0;transform:translate(100%)}.ds-sidebar--overlay.ds-sidebar--overlay-open{transform:translate(0)}.ds-sidebar--overlay.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--overlay.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sidebar-header-padding, var(--space-4, 1rem));border-bottom:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0;min-height:60px;position:relative;z-index:1}:host ::ng-deep .ds-sidebar__header img{max-height:32px;width:auto}:host ::ng-deep .ds-sidebar__header h1,:host ::ng-deep .ds-sidebar__header h2,:host ::ng-deep .ds-sidebar__header h3{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__header .ds-sidebar-logo{max-height:32px;width:auto}.ds-sidebar__header .ds-sidebar-title{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__toggle-btn,.ds-sidebar__close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px));background:transparent;color:var(--sidebar-text, var(--text-default, #1f2937));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,color var(--duration-fast, .15s) ease;flex-shrink:0}.ds-sidebar__toggle-btn:hover,.ds-sidebar__close-btn:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__toggle-btn:focus-visible,.ds-sidebar__close-btn:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__body{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--sidebar-body-padding, var(--space-2, .5rem))}.ds-sidebar__body::-webkit-scrollbar{width:6px}.ds-sidebar__body::-webkit-scrollbar-track{background:transparent}.ds-sidebar__body::-webkit-scrollbar-thumb{background:var(--sidebar-scrollbar-thumb, var(--gray-300, #d1d5db));border-radius:3px}.ds-sidebar__body::-webkit-scrollbar-thumb:hover{background:var(--sidebar-scrollbar-thumb-hover, var(--gray-400, #9ca3af))}.ds-sidebar__footer{padding:var(--sidebar-footer-padding, var(--space-4, 1rem));border-top:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0}.ds-sidebar__footer:empty{display:none}:host ::ng-deep .ds-sidebar__footer button{width:100%}.ds-sidebar__footer .ds-sidebar-footer-btn{width:100%}.ds-sidebar__trigger{position:fixed;top:var(--space-4, 1rem);z-index:var(--z-index-3, 998);display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;border-radius:var(--radius-2, 8px);background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));box-shadow:var(--sidebar-trigger-shadow, var(--shadow-2, 0 4px 12px rgba(0, 0, 0, .1)));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,transform var(--duration-fast, .15s) ease}.ds-sidebar__trigger--left{left:var(--space-4, 1rem)}.ds-sidebar__trigger--right{right:var(--space-4, 1rem)}.ds-sidebar__trigger:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__trigger:active{transform:scale(.95)}.ds-sidebar__trigger:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}:host-context(.theme-dark) .ds-sidebar{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}:host-context(.theme-dark) .ds-sidebar__backdrop{background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .7))}:host-context(.theme-dark) .ds-sidebar__trigger{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media print{.ds-sidebar,.ds-sidebar__backdrop,.ds-sidebar__trigger{display:none!important}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], responsiveBreakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsiveBreakpoint", required: false }] }], autoCollapseOnMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCollapseOnMobile", required: false }] }], showTooltips: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTooltips", required: false }] }], initialActiveItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialActiveItemId", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], itemExpand: [{ type: i0.Output, args: ["itemExpand"] }], modeChange: [{ type: i0.Output, args: ["modeChange"] }], overlayOpened: [{ type: i0.Output, args: ["overlayOpened"] }], overlayClosed: [{ type: i0.Output, args: ["overlayClosed"] }], sidebarContainer: [{
+            args: [{ selector: 'ds-sidebar', standalone: true, imports: [CommonModule, FontAwesomeModule, DsSidebarItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Backdrop (mode overlay) -->\n@if (internalMode() === 'overlay' && isOverlayOpen()) {\n  <div\n    class=\"ds-sidebar__backdrop\"\n    (click)=\"handleBackdropClick()\"\n    aria-hidden=\"true\">\n  </div>\n}\n\n<!-- Sidebar container -->\n<nav\n  #sidebarContainer\n  [class]=\"containerClasses()\"\n  [attr.aria-label]=\"ariaLabel()\"\n  role=\"navigation\"\n  (keydown)=\"handleKeyDown($event)\">\n\n  <!-- Header -->\n  <div class=\"ds-sidebar__header\">\n    <ng-content select=\"[sidebar-header]\"></ng-content>\n\n    <!-- Toggle button -->\n    @if (collapsible() && internalMode() !== 'overlay') {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__toggle-btn\"\n        [attr.aria-label]=\"internalMode() === 'collapsed' ? 'D\u00E9velopper la sidebar' : 'R\u00E9duire la sidebar'\"\n        [attr.aria-expanded]=\"internalMode() === 'full'\"\n        (click)=\"toggleMode()\">\n        <fa-icon [icon]=\"internalMode() === 'collapsed' ? expandIcon : collapseIcon\" />\n      </button>\n    }\n\n    <!-- Close button (overlay mode) -->\n    @if (internalMode() === 'overlay' && isOverlayOpen()) {\n      <button\n        type=\"button\"\n        class=\"ds-sidebar__close-btn\"\n        aria-label=\"Fermer le menu\"\n        (click)=\"closeOverlay()\">\n        <fa-icon [icon]=\"collapseIcon\" />\n      </button>\n    }\n  </div>\n\n  <!-- Body (items) -->\n  <div class=\"ds-sidebar__body\" role=\"menubar\" aria-orientation=\"vertical\">\n    @for (item of items(); track item.id) {\n      <ds-sidebar-item\n        [item]=\"item\"\n        [level]=\"0\"\n        [mode]=\"internalMode()\"\n        [showTooltip]=\"showTooltips()\"\n        [sidebarPosition]=\"position()\"\n        [collapsedTrigger]=\"collapsedTrigger()\"\n        [expandedItemIds]=\"expandedItemIds()\"\n        [activeItemId]=\"activeItemId()\"\n        (itemClick)=\"handleItemClick($event)\"\n        (itemToggle)=\"handleItemToggle($event)\"\n        (itemKeydown)=\"handleItemKeydown($event)\" />\n    }\n  </div>\n\n  <!-- Footer -->\n  <div class=\"ds-sidebar__footer\">\n    <ng-content select=\"[sidebar-footer]\"></ng-content>\n  </div>\n</nav>\n\n<!-- Bouton expand (mode collapsed uniquement) - \u00E0 l'ext\u00E9rieur du nav pour \u00E9viter overflow:hidden -->\n@if (collapsible() && internalMode() === 'collapsed') {\n  <button\n    type=\"button\"\n    class=\"ds-sidebar__expand-btn\"\n    [class.ds-sidebar__expand-btn--left]=\"position() === 'right'\"\n    aria-label=\"D\u00E9velopper la sidebar\"\n    (click)=\"toggleMode()\">\n    <fa-icon [icon]=\"expandIcon\" />\n  </button>\n}\n\n<!-- Trigger button (overlay mode, quand ferm\u00E9) -->\n@if (internalMode() === 'overlay' && !isOverlayOpen()) {\n  <button\n    type=\"button\"\n    class=\"ds-sidebar__trigger\"\n    [class.ds-sidebar__trigger--left]=\"position() === 'left'\"\n    [class.ds-sidebar__trigger--right]=\"position() === 'right'\"\n    aria-label=\"Ouvrir le menu\"\n    aria-haspopup=\"menu\"\n    [attr.aria-expanded]=\"isOverlayOpen()\"\n    (click)=\"openOverlay()\">\n    <fa-icon [icon]=\"menuIcon\" />\n  </button>\n}\n", styles: [":host{display:flex;position:relative;height:100%}.ds-sidebar__backdrop{position:fixed;inset:0;background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .5));z-index:var(--z-index-full, 9999);opacity:0;animation:fadeIn var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ds-sidebar{display:flex;flex-direction:column;height:100%;position:relative;overflow:hidden;background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));transition:width var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease,transform var(--sidebar-transition-duration, var(--duration-normal, .2s)) ease}.ds-sidebar--left{border-right:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--right{border-left:1px solid var(--sidebar-border, var(--border-default, #e5e7eb))}.ds-sidebar--full{width:var(--sidebar-width-md, 240px)}.ds-sidebar--full.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--full.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar--collapsed{width:var(--sidebar-width-collapsed, 64px)}.ds-sidebar--collapsed .ds-sidebar__header,.ds-sidebar--collapsed .ds-sidebar__footer{padding:var(--space-2, .5rem);justify-content:center}.ds-sidebar--collapsed .ds-sidebar__toggle-btn{display:none}.ds-sidebar--overlay{position:fixed;top:0;bottom:0;z-index:var(--z-index-full, 9999);box-shadow:var(--sidebar-shadow, var(--shadow-3, 0 10px 25px rgba(0, 0, 0, .1)));transform:translate(-100%);width:var(--sidebar-width-md, 240px)}.ds-sidebar--overlay.ds-sidebar--left{left:0}.ds-sidebar--overlay.ds-sidebar--right{right:0;transform:translate(100%)}.ds-sidebar--overlay.ds-sidebar--overlay-open{transform:translate(0)}.ds-sidebar--overlay.ds-sidebar--sm{width:var(--sidebar-width-sm, 200px)}.ds-sidebar--overlay.ds-sidebar--lg{width:var(--sidebar-width-lg, 280px)}.ds-sidebar__header{display:flex;align-items:center;justify-content:space-between;padding:var(--sidebar-header-padding, var(--space-4, 1rem));border-bottom:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0;min-height:60px;position:relative;z-index:1}:host ::ng-deep .ds-sidebar__header img{max-height:32px;width:auto}:host ::ng-deep .ds-sidebar__header h1,:host ::ng-deep .ds-sidebar__header h2,:host ::ng-deep .ds-sidebar__header h3{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__header .ds-sidebar-logo{max-height:32px;width:auto}.ds-sidebar__header .ds-sidebar-title{margin:0;font-size:var(--font-size-lg, 1.125rem);font-weight:600}.ds-sidebar__toggle-btn,.ds-sidebar__close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:none;border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px));background:transparent;color:var(--sidebar-text, var(--text-default, #1f2937));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,color var(--duration-fast, .15s) ease;flex-shrink:0}.ds-sidebar__toggle-btn:hover,.ds-sidebar__close-btn:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__toggle-btn:focus-visible,.ds-sidebar__close-btn:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__body{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--sidebar-body-padding, var(--space-2, .5rem))}.ds-sidebar__body::-webkit-scrollbar{width:6px}.ds-sidebar__body::-webkit-scrollbar-track{background:transparent}.ds-sidebar__body::-webkit-scrollbar-thumb{background:var(--sidebar-scrollbar-thumb, var(--gray-300, #d1d5db));border-radius:3px}.ds-sidebar__body::-webkit-scrollbar-thumb:hover{background:var(--sidebar-scrollbar-thumb-hover, var(--gray-400, #9ca3af))}.ds-sidebar__footer{padding:var(--sidebar-footer-padding, var(--space-4, 1rem));border-top:1px solid var(--sidebar-border, var(--border-default, #e5e7eb));flex-shrink:0}.ds-sidebar__footer:empty{display:none}:host ::ng-deep .ds-sidebar__footer button{width:100%}.ds-sidebar__footer .ds-sidebar-footer-btn{width:100%}.ds-sidebar__trigger{position:fixed;top:var(--space-4, 1rem);z-index:var(--z-index-3, 998);display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;border-radius:var(--radius-2, 8px);background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));box-shadow:var(--sidebar-trigger-shadow, var(--shadow-2, 0 4px 12px rgba(0, 0, 0, .1)));cursor:pointer;transition:background-color var(--duration-fast, .15s) ease,transform var(--duration-fast, .15s) ease}.ds-sidebar__trigger--left{left:var(--space-4, 1rem)}.ds-sidebar__trigger--right{right:var(--space-4, 1rem)}.ds-sidebar__trigger:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__trigger:active{transform:scale(.95)}.ds-sidebar__trigger:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__expand-btn{position:absolute;top:50%;left:var(--sidebar-width-collapsed, 64px);transform:translateY(-50%) translate(-50%);display:flex;align-items:center;justify-content:center;width:24px;height:48px;padding:0;border:none;border-radius:0 var(--sidebar-item-radius, var(--radius-1-5, 6px)) var(--sidebar-item-radius, var(--radius-1-5, 6px)) 0;background:var(--sidebar-bg, var(--surface-default, #ffffff));color:var(--sidebar-text, var(--text-default, #1f2937));cursor:pointer;box-shadow:var(--shadow-2, 0 4px 12px rgba(0, 0, 0, .1));z-index:2;transition:background-color var(--duration-fast, .15s) ease}.ds-sidebar__expand-btn:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar__expand-btn:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar__expand-btn--left{left:auto;right:var(--sidebar-width-collapsed, 64px);transform:translateY(-50%) translate(50%);border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px)) 0 0 var(--sidebar-item-radius, var(--radius-1-5, 6px))}:host-context(.theme-dark) .ds-sidebar{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}:host-context(.theme-dark) .ds-sidebar__backdrop{background:var(--sidebar-backdrop-bg, rgba(0, 0, 0, .7))}:host-context(.theme-dark) .ds-sidebar__trigger,:host-context(.theme-dark) .ds-sidebar__expand-btn{background:var(--sidebar-bg, var(--surface-default));color:var(--sidebar-text, var(--text-default))}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media print{.ds-sidebar,.ds-sidebar__backdrop,.ds-sidebar__trigger{display:none!important}}::ng-deep .ds-sidebar-popover-backdrop{background:transparent}::ng-deep .ds-sidebar-popover-panel{z-index:var(--z-index-3, 1000)}:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .ds-sidebar-logo-text,:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .logo-text{display:none}:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .ds-sidebar-logo-icon,:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .logo-icon{margin:0 auto}:host ::ng-deep .ds-sidebar--collapsed .ds-sidebar__header .sidebar-logo{padding:0;justify-content:center}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], responsiveBreakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsiveBreakpoint", required: false }] }], autoCollapseOnMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCollapseOnMobile", required: false }] }], showTooltips: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTooltips", required: false }] }], collapsedTrigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsedTrigger", required: false }] }], initialActiveItemId: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialActiveItemId", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], itemExpand: [{ type: i0.Output, args: ["itemExpand"] }], modeChange: [{ type: i0.Output, args: ["modeChange"] }], overlayOpened: [{ type: i0.Output, args: ["overlayOpened"] }], overlayClosed: [{ type: i0.Output, args: ["overlayClosed"] }], sidebarContainer: [{
                 type: ViewChild,
                 args: ['sidebarContainer']
             }], itemComponents: [{
@@ -14605,6 +15002,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                 args: [DsSidebarItemComponent]
             }] } });
 
+class DsSidebarFooterItemComponent {
+    // Inputs (signals)
+    icon = input.required(...(ngDevMode ? [{ debugName: "icon" }] : []));
+    label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
+    mode = input('full', ...(ngDevMode ? [{ debugName: "mode" }] : []));
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    // Outputs (signals)
+    clicked = output();
+    // Computed
+    isCollapsed = computed(() => this.mode() === 'collapsed', ...(ngDevMode ? [{ debugName: "isCollapsed" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsSidebarFooterItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsSidebarFooterItemComponent, isStandalone: true, selector: "ds-sidebar-footer-item", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"ds-sidebar-footer-item\"\n  [class.ds-sidebar-footer-item--collapsed]=\"isCollapsed()\"\n  [class.ds-sidebar-footer-item--danger]=\"variant() === 'danger'\"\n  [attr.aria-label]=\"label()\"\n  [attr.title]=\"isCollapsed() ? label() : null\"\n  (click)=\"clicked.emit()\">\n  <fa-icon [icon]=\"icon()\" />\n  @if (!isCollapsed()) {\n    <span class=\"ds-sidebar-footer-item__label\">{{ label() }}</span>\n  }\n</button>\n", styles: [".ds-sidebar-footer-item{display:flex;align-items:center;gap:var(--space-2, .5rem);width:100%;padding:var(--space-3, .75rem);border:none;border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px));background:transparent;color:var(--sidebar-text, var(--text-default, #1f2937));font-size:var(--font-size-sm, .875rem);cursor:pointer;transition:background-color var(--duration-fast, .15s) ease}.ds-sidebar-footer-item:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar-footer-item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar-footer-item--collapsed{justify-content:center;padding:var(--space-2, .5rem)}.ds-sidebar-footer-item--danger{background:var(--color-error, #ef4444);color:#fff}.ds-sidebar-footer-item--danger:hover{background:var(--color-error-hover, #dc2626)}.ds-sidebar-footer-item__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsSidebarFooterItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ds-sidebar-footer-item', standalone: true, imports: [FaIconComponent], template: "<button\n  type=\"button\"\n  class=\"ds-sidebar-footer-item\"\n  [class.ds-sidebar-footer-item--collapsed]=\"isCollapsed()\"\n  [class.ds-sidebar-footer-item--danger]=\"variant() === 'danger'\"\n  [attr.aria-label]=\"label()\"\n  [attr.title]=\"isCollapsed() ? label() : null\"\n  (click)=\"clicked.emit()\">\n  <fa-icon [icon]=\"icon()\" />\n  @if (!isCollapsed()) {\n    <span class=\"ds-sidebar-footer-item__label\">{{ label() }}</span>\n  }\n</button>\n", styles: [".ds-sidebar-footer-item{display:flex;align-items:center;gap:var(--space-2, .5rem);width:100%;padding:var(--space-3, .75rem);border:none;border-radius:var(--sidebar-item-radius, var(--radius-1-5, 6px));background:transparent;color:var(--sidebar-text, var(--text-default, #1f2937));font-size:var(--font-size-sm, .875rem);cursor:pointer;transition:background-color var(--duration-fast, .15s) ease}.ds-sidebar-footer-item:hover{background:var(--sidebar-item-hover-bg, var(--gray-100, rgba(0, 0, 0, .05)))}.ds-sidebar-footer-item:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:2px}.ds-sidebar-footer-item--collapsed{justify-content:center;padding:var(--space-2, .5rem)}.ds-sidebar-footer-item--danger{background:var(--color-error, #ef4444);color:#fff}.ds-sidebar-footer-item--danger:hover{background:var(--color-error-hover, #dc2626)}.ds-sidebar-footer-item__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
+        }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
+
 /**
  * # DsNavList
  *
@@ -15129,11 +15544,11 @@ class DsListItem {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsListItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsListItem, isStandalone: true, selector: "ds-list-item", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, indicator: { classPropertyName: "indicator", publicName: "indicator", isSignal: true, isRequired: false, transformFunction: null }, indicatorColor: { classPropertyName: "indicatorColor", publicName: "indicatorColor", isSignal: true, isRequired: false, transformFunction: null }, checkable: { classPropertyName: "checkable", publicName: "checkable", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, completed: { classPropertyName: "completed", publicName: "completed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "checkedChange", clicked: "clicked" }, ngImport: i0, template: "<div\n  [class]=\"itemClasses()\"\n  [attr.role]=\"role()\"\n  [attr.tabindex]=\"tabindex()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-selected]=\"selected() || null\"\n  (click)=\"handleClick($event)\"\n  (keydown)=\"handleKeyDown($event)\"\n>\n  <!-- Indicateur de priorit\u00E9/statut -->\n  @if (showIndicator()) {\n    <span\n      class=\"ds-list-item__indicator\"\n      [class.ds-list-item__indicator--bar]=\"isBarIndicator()\"\n      [class.ds-list-item__indicator--dot]=\"isDotIndicator()\"\n      [style.--indicator-color]=\"resolveIndicatorColor()\"\n      aria-hidden=\"true\"\n    ></span>\n  }\n\n  <!-- Checkbox -->\n  @if (checkable()) {\n    <primitive-checkbox\n      class=\"ds-list-item__checkbox\"\n      [checked]=\"checked()\"\n      [indeterminate]=\"indeterminate()\"\n      [disabled]=\"disabled()\"\n      size=\"sm\"\n      (checkedChange)=\"handleCheckedChange($event)\"\n      (click)=\"$event.stopPropagation()\"\n    />\n  }\n\n  <!-- Contenu principal -->\n  <div class=\"ds-list-item__content\">\n    <span class=\"ds-list-item__title\">{{ title() }}</span>\n\n    @if (subtitle()) {\n      <span class=\"ds-list-item__subtitle\">{{ subtitle() }}</span>\n    }\n\n    <!-- Slot pour contenu additionnel inline (tags, badges) -->\n    <ng-content select=\"[inline]\" />\n  </div>\n\n  <!-- Zone de m\u00E9tadonn\u00E9es (time, duration, etc.) -->\n  <div class=\"ds-list-item__meta\">\n    <ng-content select=\"[meta]\" />\n  </div>\n\n  <!-- Actions (boutons, menus) - visibles au hover -->\n  <div class=\"ds-list-item__actions\">\n    <ng-content select=\"[actions]\" />\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block}.ds-list-item{display:flex;align-items:center;gap:var(--space-2, 8px);padding:0 var(--space-3, 12px);border-radius:var(--radius-1, 4px);cursor:default;transition:background-color .15s ease}.ds-list-item--sm{height:32px}.ds-list-item--sm .ds-list-item__title{font-size:var(--font-size-1, 12px)}.ds-list-item--sm .ds-list-item__subtitle{font-size:var(--font-size-0, 11px)}.ds-list-item--sm .ds-list-item__indicator--bar{height:14px}.ds-list-item--sm .ds-list-item__indicator--dot{width:6px;height:6px}.ds-list-item--md{height:40px}.ds-list-item--md .ds-list-item__title{font-size:var(--font-size-2, 14px)}.ds-list-item--md .ds-list-item__subtitle{font-size:var(--font-size-1, 12px)}.ds-list-item--md .ds-list-item__indicator--bar{height:18px}.ds-list-item--md .ds-list-item__indicator--dot{width:8px;height:8px}.ds-list-item--lg{height:48px}.ds-list-item--lg .ds-list-item__title{font-size:var(--font-size-3, 16px)}.ds-list-item--lg .ds-list-item__subtitle{font-size:var(--font-size-2, 14px)}.ds-list-item--lg .ds-list-item__indicator--bar{height:22px}.ds-list-item--lg .ds-list-item__indicator--dot{width:10px;height:10px}.ds-list-item--clickable{cursor:pointer}.ds-list-item--clickable:hover{background-color:var(--background-hover, rgba(255, 255, 255, .08))}.ds-list-item--clickable:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-list-item--clickable:active{background-color:var(--background-active, rgba(255, 255, 255, .12))}.ds-list-item--completed .ds-list-item__title{color:var(--text-muted, #9ca3af);text-decoration:line-through}.ds-list-item--completed .ds-list-item__subtitle{text-decoration:line-through}.ds-list-item--completed .ds-list-item__meta{opacity:.5}.ds-list-item--disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.ds-list-item--selected{background-color:var(--background-selected, rgba(59, 130, 246, .1))}.ds-list-item--selected:hover{background-color:var(--background-selected-hover, rgba(59, 130, 246, .15))}.ds-list-item__indicator{flex-shrink:0;background-color:var(--indicator-color, var(--color-neutral, #6b7280))}.ds-list-item__indicator--bar{width:3px;border-radius:2px}.ds-list-item__indicator--dot{border-radius:50%}.ds-list-item__checkbox{flex-shrink:0}.ds-list-item__content{flex:1;display:flex;align-items:center;gap:var(--space-2, 8px);min-width:0}.ds-list-item__title{font-weight:var(--font-weight-normal, 400);color:var(--text-default, #f3f4f6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__subtitle{color:var(--text-muted, #9ca3af);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__meta{display:flex;align-items:center;gap:var(--space-2, 8px);flex-shrink:0;font-size:var(--font-size-1, 12px);color:var(--text-muted, #9ca3af)}.ds-list-item__actions{display:flex;align-items:center;gap:var(--space-1, 4px);flex-shrink:0;opacity:0;transition:opacity .15s ease}.ds-list-item:hover .ds-list-item__actions,.ds-list-item:focus-within .ds-list-item__actions{opacity:1}::ng-deep [inline]{flex-shrink:0}::ng-deep [meta]{display:inline-flex;align-items:center}::ng-deep [actions]{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PrimitiveCheckbox, selector: "primitive-checkbox", inputs: ["checked", "indeterminate", "disabled", "size", "label", "checkboxId"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DsListItem, isStandalone: true, selector: "ds-list-item", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, indicator: { classPropertyName: "indicator", publicName: "indicator", isSignal: true, isRequired: false, transformFunction: null }, indicatorColor: { classPropertyName: "indicatorColor", publicName: "indicatorColor", isSignal: true, isRequired: false, transformFunction: null }, checkable: { classPropertyName: "checkable", publicName: "checkable", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, completed: { classPropertyName: "completed", publicName: "completed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "checkedChange", clicked: "clicked" }, ngImport: i0, template: "<div\n  [class]=\"itemClasses()\"\n  [attr.role]=\"role()\"\n  [attr.tabindex]=\"tabindex()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-selected]=\"selected() || null\"\n  (click)=\"handleClick($event)\"\n  (keydown)=\"handleKeyDown($event)\"\n>\n  <!-- Indicateur de priorit\u00E9/statut (toute la hauteur) -->\n  @if (showIndicator()) {\n    <span\n      class=\"ds-list-item__indicator\"\n      [class.ds-list-item__indicator--bar]=\"isBarIndicator()\"\n      [class.ds-list-item__indicator--dot]=\"isDotIndicator()\"\n      [style.--indicator-color]=\"resolveIndicatorColor()\"\n      aria-hidden=\"true\"\n    ></span>\n  }\n\n  <!-- Wrapper des lignes -->\n  <div class=\"ds-list-item__wrapper\">\n    <!-- Ligne 1 : Checkbox + Titre + Meta + Actions -->\n    <div class=\"ds-list-item__row ds-list-item__row--primary\">\n      <!-- Checkbox -->\n      @if (checkable()) {\n        <primitive-checkbox\n          class=\"ds-list-item__checkbox\"\n          [checked]=\"checked()\"\n          [indeterminate]=\"indeterminate()\"\n          [disabled]=\"disabled()\"\n          size=\"sm\"\n          (checkedChange)=\"handleCheckedChange($event)\"\n          (click)=\"$event.stopPropagation()\"\n        />\n      }\n\n      <!-- Contenu principal -->\n      <div class=\"ds-list-item__content\">\n        <span class=\"ds-list-item__title\">{{ title() }}</span>\n\n        @if (subtitle()) {\n          <span class=\"ds-list-item__subtitle\">{{ subtitle() }}</span>\n        }\n\n        <!-- Slot pour contenu additionnel inline (tags, badges) -->\n        <ng-content select=\"[inline]\" />\n      </div>\n\n      <!-- Zone de m\u00E9tadonn\u00E9es (time, duration, etc.) -->\n      <div class=\"ds-list-item__meta\">\n        <ng-content select=\"[meta]\" />\n      </div>\n\n      <!-- Actions (boutons, menus) - visibles au hover -->\n      <div class=\"ds-list-item__actions\">\n        <ng-content select=\"[actions]\" />\n      </div>\n    </div>\n\n    <!-- Ligne 2 : Contenu secondaire (optionnel) -->\n    <div class=\"ds-list-item__row ds-list-item__row--secondary\">\n      <ng-content select=\"[secondary]\" />\n    </div>\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block}.ds-list-item{display:flex;align-items:stretch;gap:var(--space-2, 8px);padding:0 var(--space-3, 12px);border-radius:var(--radius-1, 4px);cursor:default;transition:background-color .15s ease}.ds-list-item__wrapper{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0;padding:var(--space-2, 8px) 0}.ds-list-item__row{display:flex;align-items:center;gap:var(--space-2, 8px)}.ds-list-item__row--primary{min-height:24px}.ds-list-item__row--secondary{padding-left:calc(16px + var(--space-2, 8px));padding-top:var(--space-1, 4px)}.ds-list-item__row--secondary:empty{display:none}.ds-list-item--sm .ds-list-item__wrapper{padding:var(--space-1, 4px) 0}.ds-list-item--sm .ds-list-item__row--primary{min-height:20px}.ds-list-item--sm .ds-list-item__title{font-size:var(--font-size-1, 12px)}.ds-list-item--sm .ds-list-item__subtitle{font-size:var(--font-size-0, 11px)}.ds-list-item--sm .ds-list-item__indicator--bar{width:3px;align-self:stretch}.ds-list-item--sm .ds-list-item__indicator--dot{width:6px;height:6px}.ds-list-item--sm .ds-list-item__row--secondary{padding-left:calc(14px + var(--space-1, 4px))}.ds-list-item--md .ds-list-item__row--primary{min-height:24px}.ds-list-item--md .ds-list-item__title{font-size:var(--font-size-2, 14px)}.ds-list-item--md .ds-list-item__subtitle{font-size:var(--font-size-1, 12px)}.ds-list-item--md .ds-list-item__indicator--bar{width:3px;align-self:stretch}.ds-list-item--md .ds-list-item__indicator--dot{width:8px;height:8px}.ds-list-item--lg .ds-list-item__wrapper{padding:var(--space-3, 12px) 0}.ds-list-item--lg .ds-list-item__row--primary{min-height:28px}.ds-list-item--lg .ds-list-item__title{font-size:var(--font-size-3, 16px)}.ds-list-item--lg .ds-list-item__subtitle{font-size:var(--font-size-2, 14px)}.ds-list-item--lg .ds-list-item__indicator--bar{width:4px;align-self:stretch}.ds-list-item--lg .ds-list-item__indicator--dot{width:10px;height:10px}.ds-list-item--lg .ds-list-item__row--secondary{padding-left:calc(18px + var(--space-2, 8px))}.ds-list-item--clickable{cursor:pointer}.ds-list-item--clickable:hover{background-color:var(--background-hover, rgba(255, 255, 255, .08))}.ds-list-item--clickable:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-list-item--clickable:active{background-color:var(--background-active, rgba(255, 255, 255, .12))}.ds-list-item--completed .ds-list-item__title{color:var(--text-muted, #9ca3af);text-decoration:line-through}.ds-list-item--completed .ds-list-item__subtitle{text-decoration:line-through}.ds-list-item--completed .ds-list-item__meta{opacity:.5}.ds-list-item--disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.ds-list-item--selected{background-color:var(--background-selected, rgba(59, 130, 246, .1))}.ds-list-item--selected:hover{background-color:var(--background-selected-hover, rgba(59, 130, 246, .15))}.ds-list-item__indicator{flex-shrink:0;background-color:var(--indicator-color, var(--color-neutral, #6b7280))}.ds-list-item__indicator--bar{width:3px;border-radius:2px;align-self:stretch}.ds-list-item__indicator--dot{border-radius:50%;align-self:center}.ds-list-item__checkbox{flex-shrink:0}.ds-list-item__content{flex:1;display:flex;align-items:center;gap:var(--space-2, 8px);min-width:0}.ds-list-item__title{font-weight:var(--font-weight-normal, 400);color:var(--text-default, #f3f4f6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__subtitle{color:var(--text-muted, #9ca3af);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__meta{display:flex;align-items:center;gap:var(--space-2, 8px);flex-shrink:0;font-size:var(--font-size-1, 12px);color:var(--text-muted, #9ca3af)}.ds-list-item__actions{display:flex;align-items:center;gap:var(--space-1, 4px);flex-shrink:0;opacity:0;transition:opacity .15s ease}.ds-list-item:hover .ds-list-item__actions,.ds-list-item:focus-within .ds-list-item__actions{opacity:1}::ng-deep [inline]{flex-shrink:0}::ng-deep [meta]{display:inline-flex;align-items:center}::ng-deep [actions]{display:inline-flex;align-items:center}::ng-deep [secondary]{display:flex;align-items:center;gap:var(--space-1, 4px);flex-wrap:wrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: PrimitiveCheckbox, selector: "primitive-checkbox", inputs: ["checked", "indeterminate", "disabled", "size", "label", "checkboxId"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DsListItem, decorators: [{
             type: Component,
-            args: [{ selector: 'ds-list-item', standalone: true, imports: [CommonModule, PrimitiveCheckbox], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  [class]=\"itemClasses()\"\n  [attr.role]=\"role()\"\n  [attr.tabindex]=\"tabindex()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-selected]=\"selected() || null\"\n  (click)=\"handleClick($event)\"\n  (keydown)=\"handleKeyDown($event)\"\n>\n  <!-- Indicateur de priorit\u00E9/statut -->\n  @if (showIndicator()) {\n    <span\n      class=\"ds-list-item__indicator\"\n      [class.ds-list-item__indicator--bar]=\"isBarIndicator()\"\n      [class.ds-list-item__indicator--dot]=\"isDotIndicator()\"\n      [style.--indicator-color]=\"resolveIndicatorColor()\"\n      aria-hidden=\"true\"\n    ></span>\n  }\n\n  <!-- Checkbox -->\n  @if (checkable()) {\n    <primitive-checkbox\n      class=\"ds-list-item__checkbox\"\n      [checked]=\"checked()\"\n      [indeterminate]=\"indeterminate()\"\n      [disabled]=\"disabled()\"\n      size=\"sm\"\n      (checkedChange)=\"handleCheckedChange($event)\"\n      (click)=\"$event.stopPropagation()\"\n    />\n  }\n\n  <!-- Contenu principal -->\n  <div class=\"ds-list-item__content\">\n    <span class=\"ds-list-item__title\">{{ title() }}</span>\n\n    @if (subtitle()) {\n      <span class=\"ds-list-item__subtitle\">{{ subtitle() }}</span>\n    }\n\n    <!-- Slot pour contenu additionnel inline (tags, badges) -->\n    <ng-content select=\"[inline]\" />\n  </div>\n\n  <!-- Zone de m\u00E9tadonn\u00E9es (time, duration, etc.) -->\n  <div class=\"ds-list-item__meta\">\n    <ng-content select=\"[meta]\" />\n  </div>\n\n  <!-- Actions (boutons, menus) - visibles au hover -->\n  <div class=\"ds-list-item__actions\">\n    <ng-content select=\"[actions]\" />\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block}.ds-list-item{display:flex;align-items:center;gap:var(--space-2, 8px);padding:0 var(--space-3, 12px);border-radius:var(--radius-1, 4px);cursor:default;transition:background-color .15s ease}.ds-list-item--sm{height:32px}.ds-list-item--sm .ds-list-item__title{font-size:var(--font-size-1, 12px)}.ds-list-item--sm .ds-list-item__subtitle{font-size:var(--font-size-0, 11px)}.ds-list-item--sm .ds-list-item__indicator--bar{height:14px}.ds-list-item--sm .ds-list-item__indicator--dot{width:6px;height:6px}.ds-list-item--md{height:40px}.ds-list-item--md .ds-list-item__title{font-size:var(--font-size-2, 14px)}.ds-list-item--md .ds-list-item__subtitle{font-size:var(--font-size-1, 12px)}.ds-list-item--md .ds-list-item__indicator--bar{height:18px}.ds-list-item--md .ds-list-item__indicator--dot{width:8px;height:8px}.ds-list-item--lg{height:48px}.ds-list-item--lg .ds-list-item__title{font-size:var(--font-size-3, 16px)}.ds-list-item--lg .ds-list-item__subtitle{font-size:var(--font-size-2, 14px)}.ds-list-item--lg .ds-list-item__indicator--bar{height:22px}.ds-list-item--lg .ds-list-item__indicator--dot{width:10px;height:10px}.ds-list-item--clickable{cursor:pointer}.ds-list-item--clickable:hover{background-color:var(--background-hover, rgba(255, 255, 255, .08))}.ds-list-item--clickable:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-list-item--clickable:active{background-color:var(--background-active, rgba(255, 255, 255, .12))}.ds-list-item--completed .ds-list-item__title{color:var(--text-muted, #9ca3af);text-decoration:line-through}.ds-list-item--completed .ds-list-item__subtitle{text-decoration:line-through}.ds-list-item--completed .ds-list-item__meta{opacity:.5}.ds-list-item--disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.ds-list-item--selected{background-color:var(--background-selected, rgba(59, 130, 246, .1))}.ds-list-item--selected:hover{background-color:var(--background-selected-hover, rgba(59, 130, 246, .15))}.ds-list-item__indicator{flex-shrink:0;background-color:var(--indicator-color, var(--color-neutral, #6b7280))}.ds-list-item__indicator--bar{width:3px;border-radius:2px}.ds-list-item__indicator--dot{border-radius:50%}.ds-list-item__checkbox{flex-shrink:0}.ds-list-item__content{flex:1;display:flex;align-items:center;gap:var(--space-2, 8px);min-width:0}.ds-list-item__title{font-weight:var(--font-weight-normal, 400);color:var(--text-default, #f3f4f6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__subtitle{color:var(--text-muted, #9ca3af);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__meta{display:flex;align-items:center;gap:var(--space-2, 8px);flex-shrink:0;font-size:var(--font-size-1, 12px);color:var(--text-muted, #9ca3af)}.ds-list-item__actions{display:flex;align-items:center;gap:var(--space-1, 4px);flex-shrink:0;opacity:0;transition:opacity .15s ease}.ds-list-item:hover .ds-list-item__actions,.ds-list-item:focus-within .ds-list-item__actions{opacity:1}::ng-deep [inline]{flex-shrink:0}::ng-deep [meta]{display:inline-flex;align-items:center}::ng-deep [actions]{display:inline-flex;align-items:center}\n"] }]
+            args: [{ selector: 'ds-list-item', standalone: true, imports: [CommonModule, PrimitiveCheckbox], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  [class]=\"itemClasses()\"\n  [attr.role]=\"role()\"\n  [attr.tabindex]=\"tabindex()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-selected]=\"selected() || null\"\n  (click)=\"handleClick($event)\"\n  (keydown)=\"handleKeyDown($event)\"\n>\n  <!-- Indicateur de priorit\u00E9/statut (toute la hauteur) -->\n  @if (showIndicator()) {\n    <span\n      class=\"ds-list-item__indicator\"\n      [class.ds-list-item__indicator--bar]=\"isBarIndicator()\"\n      [class.ds-list-item__indicator--dot]=\"isDotIndicator()\"\n      [style.--indicator-color]=\"resolveIndicatorColor()\"\n      aria-hidden=\"true\"\n    ></span>\n  }\n\n  <!-- Wrapper des lignes -->\n  <div class=\"ds-list-item__wrapper\">\n    <!-- Ligne 1 : Checkbox + Titre + Meta + Actions -->\n    <div class=\"ds-list-item__row ds-list-item__row--primary\">\n      <!-- Checkbox -->\n      @if (checkable()) {\n        <primitive-checkbox\n          class=\"ds-list-item__checkbox\"\n          [checked]=\"checked()\"\n          [indeterminate]=\"indeterminate()\"\n          [disabled]=\"disabled()\"\n          size=\"sm\"\n          (checkedChange)=\"handleCheckedChange($event)\"\n          (click)=\"$event.stopPropagation()\"\n        />\n      }\n\n      <!-- Contenu principal -->\n      <div class=\"ds-list-item__content\">\n        <span class=\"ds-list-item__title\">{{ title() }}</span>\n\n        @if (subtitle()) {\n          <span class=\"ds-list-item__subtitle\">{{ subtitle() }}</span>\n        }\n\n        <!-- Slot pour contenu additionnel inline (tags, badges) -->\n        <ng-content select=\"[inline]\" />\n      </div>\n\n      <!-- Zone de m\u00E9tadonn\u00E9es (time, duration, etc.) -->\n      <div class=\"ds-list-item__meta\">\n        <ng-content select=\"[meta]\" />\n      </div>\n\n      <!-- Actions (boutons, menus) - visibles au hover -->\n      <div class=\"ds-list-item__actions\">\n        <ng-content select=\"[actions]\" />\n      </div>\n    </div>\n\n    <!-- Ligne 2 : Contenu secondaire (optionnel) -->\n    <div class=\"ds-list-item__row ds-list-item__row--secondary\">\n      <ng-content select=\"[secondary]\" />\n    </div>\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";:host{display:block}.ds-list-item{display:flex;align-items:stretch;gap:var(--space-2, 8px);padding:0 var(--space-3, 12px);border-radius:var(--radius-1, 4px);cursor:default;transition:background-color .15s ease}.ds-list-item__wrapper{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0;padding:var(--space-2, 8px) 0}.ds-list-item__row{display:flex;align-items:center;gap:var(--space-2, 8px)}.ds-list-item__row--primary{min-height:24px}.ds-list-item__row--secondary{padding-left:calc(16px + var(--space-2, 8px));padding-top:var(--space-1, 4px)}.ds-list-item__row--secondary:empty{display:none}.ds-list-item--sm .ds-list-item__wrapper{padding:var(--space-1, 4px) 0}.ds-list-item--sm .ds-list-item__row--primary{min-height:20px}.ds-list-item--sm .ds-list-item__title{font-size:var(--font-size-1, 12px)}.ds-list-item--sm .ds-list-item__subtitle{font-size:var(--font-size-0, 11px)}.ds-list-item--sm .ds-list-item__indicator--bar{width:3px;align-self:stretch}.ds-list-item--sm .ds-list-item__indicator--dot{width:6px;height:6px}.ds-list-item--sm .ds-list-item__row--secondary{padding-left:calc(14px + var(--space-1, 4px))}.ds-list-item--md .ds-list-item__row--primary{min-height:24px}.ds-list-item--md .ds-list-item__title{font-size:var(--font-size-2, 14px)}.ds-list-item--md .ds-list-item__subtitle{font-size:var(--font-size-1, 12px)}.ds-list-item--md .ds-list-item__indicator--bar{width:3px;align-self:stretch}.ds-list-item--md .ds-list-item__indicator--dot{width:8px;height:8px}.ds-list-item--lg .ds-list-item__wrapper{padding:var(--space-3, 12px) 0}.ds-list-item--lg .ds-list-item__row--primary{min-height:28px}.ds-list-item--lg .ds-list-item__title{font-size:var(--font-size-3, 16px)}.ds-list-item--lg .ds-list-item__subtitle{font-size:var(--font-size-2, 14px)}.ds-list-item--lg .ds-list-item__indicator--bar{width:4px;align-self:stretch}.ds-list-item--lg .ds-list-item__indicator--dot{width:10px;height:10px}.ds-list-item--lg .ds-list-item__row--secondary{padding-left:calc(18px + var(--space-2, 8px))}.ds-list-item--clickable{cursor:pointer}.ds-list-item--clickable:hover{background-color:var(--background-hover, rgba(255, 255, 255, .08))}.ds-list-item--clickable:focus-visible{outline:2px solid var(--color-primary, #3b82f6);outline-offset:-2px}.ds-list-item--clickable:active{background-color:var(--background-active, rgba(255, 255, 255, .12))}.ds-list-item--completed .ds-list-item__title{color:var(--text-muted, #9ca3af);text-decoration:line-through}.ds-list-item--completed .ds-list-item__subtitle{text-decoration:line-through}.ds-list-item--completed .ds-list-item__meta{opacity:.5}.ds-list-item--disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.ds-list-item--selected{background-color:var(--background-selected, rgba(59, 130, 246, .1))}.ds-list-item--selected:hover{background-color:var(--background-selected-hover, rgba(59, 130, 246, .15))}.ds-list-item__indicator{flex-shrink:0;background-color:var(--indicator-color, var(--color-neutral, #6b7280))}.ds-list-item__indicator--bar{width:3px;border-radius:2px;align-self:stretch}.ds-list-item__indicator--dot{border-radius:50%;align-self:center}.ds-list-item__checkbox{flex-shrink:0}.ds-list-item__content{flex:1;display:flex;align-items:center;gap:var(--space-2, 8px);min-width:0}.ds-list-item__title{font-weight:var(--font-weight-normal, 400);color:var(--text-default, #f3f4f6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__subtitle{color:var(--text-muted, #9ca3af);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ds-list-item__meta{display:flex;align-items:center;gap:var(--space-2, 8px);flex-shrink:0;font-size:var(--font-size-1, 12px);color:var(--text-muted, #9ca3af)}.ds-list-item__actions{display:flex;align-items:center;gap:var(--space-1, 4px);flex-shrink:0;opacity:0;transition:opacity .15s ease}.ds-list-item:hover .ds-list-item__actions,.ds-list-item:focus-within .ds-list-item__actions{opacity:1}::ng-deep [inline]{flex-shrink:0}::ng-deep [meta]{display:inline-flex;align-items:center}::ng-deep [actions]{display:inline-flex;align-items:center}::ng-deep [secondary]{display:flex;align-items:center;gap:var(--space-1, 4px);flex-wrap:wrap}\n"] }]
         }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], indicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "indicator", required: false }] }], indicatorColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "indicatorColor", required: false }] }], checkable: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkable", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }], completed: [{ type: i0.Input, args: [{ isSignal: true, alias: "completed", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], checkedChange: [{ type: i0.Output, args: ["checkedChange"] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
 
 /**
@@ -15519,91 +15934,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
  */
 // Design System components exports
 
-const BUTTON_VARIANT_OPTIONS = ['primary', 'secondary', 'ghost', 'success', 'warning', 'error', 'info'];
-const BUTTON_APPEARANCE_OPTIONS = ['solid', 'outline'];
-const BUTTON_SIZE_OPTIONS = ['sm', 'md', 'lg'];
-const buildButtonArgTypes = ({ includeLoading = true, includeBlock = true, variantDescription = 'Variante visuelle', appearanceDescription = 'Apparence', sizeDescription = 'Taille', disabledDescription = 'Désactivé', loadingDescription = 'En chargement', blockDescription = 'Pleine largeur', } = {}) => ({
-    variant: {
-        control: 'select',
-        options: BUTTON_VARIANT_OPTIONS,
-        description: variantDescription,
-    },
-    appearance: {
-        control: 'select',
-        options: BUTTON_APPEARANCE_OPTIONS,
-        description: appearanceDescription,
-    },
-    size: {
-        control: 'select',
-        options: BUTTON_SIZE_OPTIONS,
-        description: sizeDescription,
-    },
-    disabled: {
-        control: 'boolean',
-        description: disabledDescription,
-    },
-    ...(includeLoading
-        ? {
-            loading: {
-                control: 'boolean',
-                description: loadingDescription,
-            },
-        }
-        : {}),
-    ...(includeBlock
-        ? {
-            block: {
-                control: 'boolean',
-                description: blockDescription,
-            },
-        }
-        : {}),
-});
-const buildButtonArgs = ({ includeLoading = true, includeBlock = true } = {}) => ({
-    variant: 'primary',
-    appearance: 'solid',
-    size: 'md',
-    disabled: false,
-    ...(includeLoading ? { loading: false } : {}),
-    ...(includeBlock ? { block: false } : {}),
-});
-const createVariantRender = (tagName, bindings, extraAttributes = '') => (args) => ({
-    props: { ...args, variants: BUTTON_VARIANT_OPTIONS },
-    template: `
-      <div style="display: flex; gap: 8px; flex-wrap: wrap; align-items: center;">
-        <${tagName}
-          *ngFor="let variant of variants"
-          [${bindings.variant}]="variant"${bindings.appearance ? `
-          [${bindings.appearance}]="appearance"` : ''}
-          [${bindings.size}]="size"${bindings.disabled ? `
-          [${bindings.disabled}]="disabled"` : ''}${bindings.loading ? `
-          [${bindings.loading}]="loading"` : ''}${bindings.block ? `
-          [${bindings.block}]="block"` : ''}${extraAttributes ? `
-          ${extraAttributes}` : ''}>
-          {{ variant }}
-        </${tagName}>
-      </div>
-    `,
-});
-const createSizeRender = (tagName, bindings, extraAttributes = '') => (args) => ({
-    props: { ...args, sizes: BUTTON_SIZE_OPTIONS },
-    template: `
-      <div style="display: flex; gap: 8px; align-items: center;">
-        <${tagName}
-          *ngFor="let size of sizes"
-          [${bindings.size}]="size"${bindings.variant ? `
-          [${bindings.variant}]="variant"` : ''}${bindings.appearance ? `
-          [${bindings.appearance}]="appearance"` : ''}${bindings.disabled ? `
-          [${bindings.disabled}]="disabled"` : ''}${bindings.loading ? `
-          [${bindings.loading}]="loading"` : ''}${bindings.block ? `
-          [${bindings.block}]="block"` : ''}${extraAttributes ? `
-          ${extraAttributes}` : ''}>
-          {{ size }}
-        </${tagName}>
-      </div>
-    `,
-});
-
 /**
  * Service centralisé pour l'enregistrement des icônes FontAwesome.
  *
@@ -16085,5 +16415,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AUTOCOMPLETE_POSITIONS, BUTTON_APPEARANCE_OPTIONS, BUTTON_SIZE_OPTIONS, BUTTON_VARIANT_OPTIONS, DROPDOWN_POSITIONS, DROPDOWN_POSITIONS_RIGHT, DROPDOWN_POSITIONS_TOP, DsAccordion, DsAlert, DsAvatar, DsBadge, DsBreadcrumb, DsButton, DsCalendar, DsCard, DsCarousel, DsCheckbox, DsCheckboxList, DsChip, DsColorPicker, DsCombobox, DsContainer, DsDatePicker, DsDivider, DsDrawer, DsDropdown, DsEmpty, DsFileUpload, DsI18nService, DsInputField, DsInputNumber, DsInputTextarea, DsList, DsListGroup, DsListItem, DsMenu, DsModalComponent, DsNavList, DsNotificationContainerComponent, DsNotificationItemComponent, DsNotificationService, DsPagination, DsPasswordStrength, DsPopover, DsPopoverComponent, DsProgressBar, DsRadioGroup, DsRating, DsSearchInput, DsSegmentedControl, DsSelect, DsSidebar, DsSidebarItemComponent, DsSkeleton, DsSlider, DsStepper, DsTable, DsTabs, DsTimePicker, DsTimeline, DsToastComponent, DsToastContainerComponent, DsToastService, DsToggle, DsTooltip, DsTooltipComponent, DsTransfer, DsTree, IconRegistryService, POPOVER_POSITIONS, PrimitiveBadge, PrimitiveButton, PrimitiveCheckbox, PrimitiveInput, PrimitiveRadio, PrimitiveTextarea, PrimitiveToggle, TOOLTIP_POSITIONS, buildButtonArgTypes, buildButtonArgs, createSizeRender, createVariantRender, generateId, generateShortId };
+export { AUTOCOMPLETE_POSITIONS, DROPDOWN_POSITIONS, DROPDOWN_POSITIONS_RIGHT, DROPDOWN_POSITIONS_TOP, DsAccordion, DsAlert, DsAvatar, DsBadge, DsBreadcrumb, DsButton, DsCalendar, DsCard, DsCarousel, DsCheckbox, DsCheckboxList, DsChip, DsColorPicker, DsCombobox, DsContainer, DsDatePicker, DsDivider, DsDrawer, DsDropdown, DsEmpty, DsFileUpload, DsI18nService, DsInputField, DsInputNumber, DsInputTextarea, DsList, DsListGroup, DsListItem, DsMenu, DsModalComponent, DsNavList, DsNotificationContainerComponent, DsNotificationItemComponent, DsNotificationService, DsPagination, DsPasswordStrength, DsPopover, DsPopoverComponent, DsProgressBar, DsRadioGroup, DsRating, DsSearchInput, DsSegmentedControl, DsSelect, DsSidebar, DsSidebarFooterItemComponent, DsSidebarItemComponent, DsSkeleton, DsSlider, DsStepper, DsTable, DsTabs, DsTimePicker, DsTimeline, DsToastComponent, DsToastContainerComponent, DsToastService, DsToggle, DsTooltip, DsTooltipComponent, DsTransfer, DsTree, IconRegistryService, POPOVER_POSITIONS, PrimitiveBadge, PrimitiveButton, PrimitiveCheckbox, PrimitiveInput, PrimitiveRadio, PrimitiveTextarea, PrimitiveToggle, SIDEBAR_POPOVER_POSITIONS_LEFT, SIDEBAR_POPOVER_POSITIONS_RIGHT, TOOLTIP_POSITIONS, generateId, generateShortId };
 //# sourceMappingURL=kksdev-ds-angular.mjs.map