@coreui/angular-pro 4.0.0-alpha.14 → 4.0.0-alpha.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -292,7 +292,7 @@ class CollapseDirective {
292
292
  this.collapseChange = new EventEmitter();
293
293
  this.collapsing = false;
294
294
  this.host = this.hostElement.nativeElement;
295
- this.setDisplay(false);
295
+ this.renderer.setStyle(this.host, 'display', 'none');
296
296
  }
297
297
  /**
298
298
  * @ignore
@@ -337,7 +337,7 @@ class CollapseDirective {
337
337
  show: this.visible,
338
338
  'collapse-horizontal': this.horizontal,
339
339
  collapsing: this.collapsing
340
- // collapse: !this.collapsing
340
+ // collapse: !this.collapsing && !this.visible
341
341
  };
342
342
  }
343
343
  ngAfterViewInit() {
@@ -361,9 +361,7 @@ class CollapseDirective {
361
361
  }
362
362
  }
363
363
  toggle(visible = this.visible) {
364
- this.setDisplay(true);
365
364
  this.createPlayer(visible);
366
- this.visible = visible;
367
365
  this.player?.play();
368
366
  }
369
367
  destroyPlayer() {
@@ -373,14 +371,17 @@ class CollapseDirective {
373
371
  if (this.player?.hasStarted()) {
374
372
  this.destroyPlayer();
375
373
  }
376
- let animationFactory;
374
+ if (visible) {
375
+ this.renderer.removeStyle(this.host, 'display');
376
+ }
377
377
  const duration = this.animate ? this.duration : '0ms';
378
378
  const expand = this.horizontal ? expandHorizontalAnimation : expandAnimation;
379
379
  const collapse = this.horizontal ? collapseHorizontalAnimation : collapseAnimation;
380
- animationFactory = this.animationBuilder.build(useAnimation(visible ? expand : collapse, { params: { time: duration, easing: this.transition } }));
380
+ const animationFactory = this.animationBuilder.build(useAnimation(visible ? expand : collapse, { params: { time: duration, easing: this.transition } }));
381
381
  this.player = animationFactory.create(this.host);
382
382
  this.player.onStart(() => {
383
383
  this.setMaxSize();
384
+ this.visible = visible;
384
385
  this.collapsing = true;
385
386
  this.collapseChange.emit(visible ? 'opening' : 'collapsing');
386
387
  });
@@ -400,9 +401,6 @@ class CollapseDirective {
400
401
  }
401
402
  });
402
403
  }
403
- setDisplay(display) {
404
- display ? this.renderer.removeStyle(this.host, 'display') : this.renderer.setStyle(this.host, 'display', 'none');
405
- }
406
404
  }
407
405
  CollapseDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: CollapseDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Directive });
408
406
  CollapseDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: CollapseDirective, selector: "[cCollapse]", inputs: { animate: "animate", horizontal: "horizontal", visible: "visible", navbar: "navbar", duration: "duration", transition: "transition" }, outputs: { collapseChange: "collapseChange" }, host: { properties: { "class": "this.hostClasses" } }, exportAs: ["cCollapse"], usesOnChanges: true, ngImport: i0 });