fix(modal): sheet is easier to dismiss with swipe

[liamdebeasi]

⚠️ Note to reviewer: Please test manually on a device. This fix depends on how quickly you swipe which cannot be easily tested on CI.

Dev build: 6.2.6-dev.11662502742.1ac13490

Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
  • Some docs updates need to be made in the ionic-docs repo, in a separate PR. See the contributing guide for details.
• Build (npm run build) was run locally and any changes were pushed
• Lint (npm run lint) has passed locally and any fixes were made for failures

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• Feature
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

Issue URL: resolves #24296
Given a sheet modal with breakpoints of [0, 1], it is very difficult to dismiss the sheet. Developers need to swipe more than 50% of the way down the screen in order for it to dismiss.

What is the new behavior?

• Aligned the threshold variable with that of the card modal so that short but quick swipes can also dismiss the modal.

Does this introduce a breaking change?

• Yes
• No

Other information

[sean-perkins]

After checking out FW-389 and running modal/test/sheet on a native design with the test modified for:

        <ion-button id="custom-breakpoint-modal" onclick="presentModal({ initialBreakpoint: 1, breakpoints: [0, 1] })">
          Present Sheet Modal (Custom Breakpoints)</ion-button>

I am observing that no snapping behavior is working. The sheet modal is free dragging to any value.

[liamdebeasi]

Can you pull latest + restart your dev server? The snapping is working on my end.

RPReplay_Final1662479950.mp4

[sean-perkins]

The changes look good on device. The threshold does feel sensitive when using breakpoint values of [0, 0.5, 1] and dragging down from 1. You have to be deliberate in your sensitivity to snap to the 0.5 breakpoint.

[liamdebeasi]

Good catch. I reduced the sensitivity such that it feels better for both case. Mind giving it another try?

[sean-perkins]

Thoughts on bumping from 250 to 350? With 250, I could rarely get the sheet to dismiss with [0, 0.5, 1] and the current breakpoint at 1.

500+ felt too sensitive (still resulting in accidental dismisses when trying to drag to the 0.5 breakpoint. 350 inherently felt better in Mobile Safari (XS Max)

[liamdebeasi]

Agreed, 350 feels much better. Fixed in 71c6784