Skip to content

Commit dfee5f4

Browse files
committed
fix(material/tabs): remove visibility style when hydrating
Before this commit, when using pre-rendering, the styling animation would only remove the `transform` style when hydrating the component. This commit fixes this by including `visibility` as styles to remove when playing the animations.
1 parent 35f07c5 commit dfee5f4

File tree

1 file changed

+5
-2
lines changed

1 file changed

+5
-2
lines changed

src/material/tabs/tabs-animations.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@
66
* found in the LICENSE file at https://angular.io/license
77
*/
88
import {
9+
AnimationTriggerMetadata,
910
animate,
1011
state,
1112
style,
1213
transition,
1314
trigger,
14-
AnimationTriggerMetadata,
1515
} from '@angular/animations';
1616

1717
/**
@@ -24,7 +24,10 @@ export const matTabsAnimations: {
2424
/** Animation translates a tab along the X axis. */
2525
translateTab: trigger('translateTab', [
2626
// Transitions to `none` instead of 0, because some browsers might blur the content.
27-
state('center, void, left-origin-center, right-origin-center', style({transform: 'none'})),
27+
state(
28+
'center, void, left-origin-center, right-origin-center',
29+
style({transform: 'none', visibility: 'visible'}),
30+
),
2831

2932
// If the tab is either on the left or right, we additionally add a `min-height` of 1px
3033
// in order to ensure that the element has a height before its state changes. This is

0 commit comments

Comments
 (0)