Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: IonModal animation of swipe to close gesture is broken if canDismiss specified #30129

Open
3 tasks done
da1z opened this issue Jan 11, 2025 · 0 comments
Open
3 tasks done
Labels

Comments

@da1z
Copy link

da1z commented Jan 11, 2025

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

Screen.Recording.2025-01-10.at.7.20.11.PM.mov

Expected Behavior

Animation works as expected, for example when canDismiss is not specified

Screen.Recording.2025-01-10.at.7.21.08.PM.mov

Steps to Reproduce

create modal that has canDismiss specified as function that returns true

  async function canDismiss(data?: any, role?: string) {
    return true;
  }

  return (
    <IonPage ref={page}>
      <IonHeader>
        <IonToolbar>
          <IonTitle>App</IonTitle>
        </IonToolbar>
      </IonHeader>
      <IonContent className="ion-padding">
        <IonButton id="open-modal" expand="block">
          Open
        </IonButton>
        <IonModal
          ref={modal}
          trigger="open-modal"
          canDismiss={canDismiss}
          presentingElement={presentingElement!}
        >
          <IonHeader>
            <IonToolbar>
              <IonTitle>Modal</IonTitle>
              <IonButtons slot="end">
                <IonButton onClick={() => dismiss()}>Close</IonButton>
              </IonButtons>
            </IonToolbar>
          </IonHeader>
          <IonContent className="ion-padding">
            <p>
              To close this modal, please use the "Close" button provided. Note
              that swiping the modal will not dismiss it.
            </p>
          </IonContent>
        </IonModal>
      </IonContent>
    </IonPage>
  );

Code Reproduction URL

https://stackblitz.com/edit/k9wbj9qc?file=src%2Fmain.tsx

Ionic Info

running in stackblitz

Ionic:

Ionic CLI : 5.4.16

Utility:

cordova-res : not installed
native-run : not installed

System:

NodeJS : v18.20.3
npm : 10.2.3
OS : Linux 5.0

Additional Information

No response

@ionitron-bot ionitron-bot bot added the triage label Jan 11, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant