From da55ab949ef1894738da5a6241176089b7a2b6e3 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Date: Fri, 4 Aug 2023 11:14:21 -0400
Subject: [PATCH] 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`
---
 core/src/components/modal/gestures/sheet.ts | 16 ++++++++++++++--
 core/src/components/modal/modal.tsx         |  3 ++-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/core/src/components/modal/gestures/sheet.ts b/core/src/components/modal/gestures/sheet.ts
index 9dafceff0d..0e3fca6b8b 100644
--- a/core/src/components/modal/gestures/sheet.ts
+++ b/core/src/components/modal/gestures/sheet.ts
@@ -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);
     });
   };
 
diff --git a/core/src/components/modal/modal.tsx b/core/src/components/modal/modal.tsx
index 8068179c38..0a2dd0f8a8 100644
--- a/core/src/components/modal/modal.tsx
+++ b/core/src/components/modal/modal.tsx
@@ -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;