@clr/angular 16.3.6 → 16.3.7

package/fesm2020/clr-angular.mjs

@@ -2939,15 +2939,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
  * The full license information can be found in LICENSE in the root directory of this project.
  */
 class ClrExpandableAnimation {
-    constructor(element, domAdapter) {
+    constructor(element, domAdapter, renderer) {
         this.element = element;
         this.domAdapter = domAdapter;
+        this.renderer = renderer;
         this.startHeight = 0;
     }
     get expandAnimation() {
         return { value: this.clrExpandTrigger, params: { startHeight: this.startHeight } };
     }
+    animationStart() {
+        this.renderer.setStyle(this.element.nativeElement, 'overflow', 'hidden');
+    }
     animationDone() {
+        this.renderer.removeStyle(this.element.nativeElement, 'overflow');
         // A "safe" auto-update of the height ensuring basic OOTB user experience .
         // Prone to small jumps in initial animation height if data was changed in the meantime, window was resized, etc.
         // For optimal behavior call manually updateStartHeight() from the parent component before initiating the update.
@@ -2957,8 +2962,8 @@ class ClrExpandableAnimation {
         this.startHeight = this.domAdapter.computedHeight(this.element.nativeElement) || 0;
     }
 }
-ClrExpandableAnimation.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: ClrExpandableAnimation, deps: [{ token: i0.ElementRef }, { token: DomAdapter }], target: i0.ɵɵFactoryTarget.Component });
-ClrExpandableAnimation.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: ClrExpandableAnimation, selector: "clr-expandable-animation", inputs: { clrExpandTrigger: "clrExpandTrigger" }, host: { listeners: { "@expandAnimation.done": "animationDone()" }, properties: { "@expandAnimation": "this.expandAnimation" } }, providers: [DomAdapter], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host{display:block;overflow:hidden}\n"], animations: [
+ClrExpandableAnimation.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.2", ngImport: i0, type: ClrExpandableAnimation, deps: [{ token: i0.ElementRef }, { token: DomAdapter }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+ClrExpandableAnimation.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.2", type: ClrExpandableAnimation, selector: "clr-expandable-animation", inputs: { clrExpandTrigger: "clrExpandTrigger" }, host: { listeners: { "@expandAnimation.start": "animationStart()", "@expandAnimation.done": "animationDone()" }, properties: { "@expandAnimation": "this.expandAnimation" } }, providers: [DomAdapter], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host{display:block}\n"], animations: [
         trigger('expandAnimation', [
             transition('true <=> false', [
                 style({ height: '{{startHeight}}px' }),
@@ -2975,12 +2980,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.2", ngImpor
                                 animate('0.2s ease-in-out', style({ height: '*' })),
                             ]),
                         ]),
-                    ], providers: [DomAdapter], styles: [":host{display:block;overflow:hidden}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DomAdapter }]; }, propDecorators: { clrExpandTrigger: [{
+                    ], providers: [DomAdapter], styles: [":host{display:block}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DomAdapter }, { type: i0.Renderer2 }]; }, propDecorators: { clrExpandTrigger: [{
                 type: Input
             }], expandAnimation: [{
                 type: HostBinding,
                 args: ['@expandAnimation']
+            }], animationStart: [{
+                type: HostListener,
+                args: ['@expandAnimation.start']
             }], animationDone: [{
                 type: HostListener,
                 args: ['@expandAnimation.done']