From f8bfe0fbf796428cf876c4c6bbddc780750b723d Mon Sep 17 00:00:00 2001 From: crisbeto Date: Sun, 27 May 2018 17:04:26 +0200 Subject: [PATCH 1/3] fix(card): disable all animations when using NoopAnimationsModule Fixes the card `box-shadow` transition not being disabled when it's inside something with the `NoopAnimationsModule`. Relates to #10590. --- src/material/card/card.scss | 2 ++ src/material/card/card.ts | 13 +++++++++++-- 2 files changed, 13 insertions(+), 2 deletions(-) diff --git a/src/material/card/card.scss b/src/material/card/card.scss index 3c7f621b4572..d531f1bf93e9 100644 --- a/src/material/card/card.scss +++ b/src/material/card/card.scss @@ -1,5 +1,6 @@ @import '../core/style/variables'; @import '../core/style/elevation'; +@import '../core/style/noop-animation'; @import '../../cdk/a11y/a11y'; @@ -9,6 +10,7 @@ $mat-card-header-size: 40px !default; .mat-card { @include mat-elevation-transition; + @include _noop-animation(); display: block; position: relative; padding: $mat-card-padding; diff --git a/src/material/card/card.ts b/src/material/card/card.ts index 431af65b8aca..438d53cdb77b 100644 --- a/src/material/card/card.ts +++ b/src/material/card/card.ts @@ -12,7 +12,10 @@ import { ChangeDetectionStrategy, Directive, Input, + Optional, + Inject, } from '@angular/core'; +import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations'; /** @@ -156,9 +159,15 @@ export class MatCardAvatar {} styleUrls: ['card.css'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, - host: {'class': 'mat-card'} + host: { + 'class': 'mat-card', + '[class._mat-animation-noopable]': '_animationMode === "NoopAnimations"', + } }) -export class MatCard {} +export class MatCard { + // @deletion-target 7.0.0 `_animationMode` parameter to be made required. + constructor(@Optional() @Inject(ANIMATION_MODULE_TYPE) public _animationMode?: string) {} +} /** From 42b84c94f8c6f987e9d2182628fc2ddfd4f6d21d Mon Sep 17 00:00:00 2001 From: Miles Malerba Date: Tue, 11 Jun 2019 15:13:16 -0700 Subject: [PATCH 2/3] fix lint --- src/material/card/card.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/material/card/card.ts b/src/material/card/card.ts index 438d53cdb77b..d885264026ce 100644 --- a/src/material/card/card.ts +++ b/src/material/card/card.ts @@ -165,7 +165,7 @@ export class MatCardAvatar {} } }) export class MatCard { - // @deletion-target 7.0.0 `_animationMode` parameter to be made required. + // @breaking-change 9.0.0 `_animationMode` parameter to be made required. constructor(@Optional() @Inject(ANIMATION_MODULE_TYPE) public _animationMode?: string) {} } From c40f2b60c7765763842867e1edcef18c9c1b8c89 Mon Sep 17 00:00:00 2001 From: Miles Malerba Date: Tue, 11 Jun 2019 15:24:16 -0700 Subject: [PATCH 3/3] fix api test --- tools/public_api_guard/material/card.d.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/tools/public_api_guard/material/card.d.ts b/tools/public_api_guard/material/card.d.ts index cc34096281aa..16df62b8f5d7 100644 --- a/tools/public_api_guard/material/card.d.ts +++ b/tools/public_api_guard/material/card.d.ts @@ -1,4 +1,6 @@ export declare class MatCard { + _animationMode?: string | undefined; + constructor(_animationMode?: string | undefined); } export declare class MatCardActions {