sass-references/angular-material/material/bottom-sheet/bottom-sheet-animations.ts

45 lines
1.2 KiB
TypeScript
Raw Normal View History

2024-12-06 10:42:08 +08:00
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.dev/license
*/
import {
animate,
state,
style,
transition,
trigger,
AnimationTriggerMetadata,
group,
query,
animateChild,
} from '@angular/animations';
import {AnimationCurves, AnimationDurations} from '@angular/material/core';
/** Animations used by the Material bottom sheet. */
export const matBottomSheetAnimations: {
readonly bottomSheetState: AnimationTriggerMetadata;
} = {
/** Animation that shows and hides a bottom sheet. */
bottomSheetState: trigger('state', [
state('void, hidden', style({transform: 'translateY(100%)'})),
state('visible', style({transform: 'translateY(0%)'})),
transition(
'visible => void, visible => hidden',
group([
animate(`${AnimationDurations.COMPLEX} ${AnimationCurves.ACCELERATION_CURVE}`),
query('@*', animateChild(), {optional: true}),
]),
),
transition(
'void => visible',
group([
animate(`${AnimationDurations.EXITING} ${AnimationCurves.DECELERATION_CURVE}`),
query('@*', animateChild(), {optional: true}),
]),
),
]),
};