mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-10 00:27:41 +08:00
fix(modal): setCurrentBreakpoint respects animated prop (#27924)
Issue number: resolves #27923 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> `setCurrentBreakpoint` still animates even when `animated: false`. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `setCurrentBreakpoint` jumps directly to the new breakpoint when `animated: false` ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Updated design doc: https://github.com/ionic-team/ionic-framework-design-documents/pull/137 Dev build: `7.2.3-dev.11691069391.1d91d2be`
This commit is contained in:
@ -31,6 +31,12 @@ export interface MoveSheetToBreakpointOptions {
|
||||
* `true` if the sheet can be transitioned and dismissed off the view.
|
||||
*/
|
||||
canDismiss?: boolean;
|
||||
|
||||
/**
|
||||
* If `true`, the sheet will animate to the breakpoint.
|
||||
* If `false`, the sheet will jump directly to the breakpoint.
|
||||
*/
|
||||
animated: boolean;
|
||||
}
|
||||
|
||||
export const createSheetGesture = (
|
||||
@ -246,11 +252,17 @@ export const createSheetGesture = (
|
||||
breakpoint: closest,
|
||||
breakpointOffset: offset,
|
||||
canDismiss: canDismissBlocksGesture,
|
||||
|
||||
/**
|
||||
* The swipe is user-driven, so we should
|
||||
* always animate when the gesture ends.
|
||||
*/
|
||||
animated: true,
|
||||
});
|
||||
};
|
||||
|
||||
const moveSheetToBreakpoint = (options: MoveSheetToBreakpointOptions) => {
|
||||
const { breakpoint, canDismiss, breakpointOffset } = options;
|
||||
const { breakpoint, canDismiss, breakpointOffset, animated } = options;
|
||||
/**
|
||||
* canDismiss should only prevent snapping
|
||||
* when users are trying to dismiss. If canDismiss
|
||||
@ -360,7 +372,7 @@ export const createSheetGesture = (
|
||||
},
|
||||
{ oneTimeCallback: true }
|
||||
)
|
||||
.progressEnd(1, 0, 500);
|
||||
.progressEnd(1, 0, animated ? 500 : 0);
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
@ -761,7 +761,7 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
||||
return;
|
||||
}
|
||||
|
||||
const { currentBreakpoint, moveSheetToBreakpoint, canDismiss, breakpoints } = this;
|
||||
const { currentBreakpoint, moveSheetToBreakpoint, canDismiss, breakpoints, animated } = this;
|
||||
|
||||
if (currentBreakpoint === breakpoint) {
|
||||
return;
|
||||
@ -772,6 +772,7 @@ export class Modal implements ComponentInterface, OverlayInterface {
|
||||
breakpoint,
|
||||
breakpointOffset: 1 - currentBreakpoint!,
|
||||
canDismiss: canDismiss !== undefined && canDismiss !== true && breakpoints![0] === 0,
|
||||
animated,
|
||||
});
|
||||
await this.sheetTransition;
|
||||
this.sheetTransition = undefined;
|
||||
|
||||
Reference in New Issue
Block a user