feat: add ability to prevent dismissing a modal dialog by clicking on the overlay

[oneolddev]

🙋 Feature Request

The current of the modal dialog does not provide an option to prevent the dismissal of the dialog when clicking on the overlay.

I have a use case where I want to prevent the user from accidentally closing the dialog by clicking or touching the overlay.

🤔 Expected Behavior

The option coudl be provided by adding an additional option to DialogParameters. When set, a modal dialog will no longer be dismissible by clicking or touching the overlay.

😯 Current Behavior

💁 Possible Solution

• add an InertModalOverlay parameter to DialogParameters
• new parameter would only be effective when Modal is true.
• modify the OnDismissAsync method of FluentDialogProvider to prevent dialog from closing if InertModalOveralay is true.

The other alternative would be to have this feature added to the underlying fluent-dialog web component.

🔦 Context

I'm trying to prevent accidental dismissal of a modal dialog.

I've removed the onclick event listener attached to the overlay using javascript. This works but requires the use of Javascript interop.

💻 Examples

[dvoituron]

You could use the Modal attribute and the FluentDialogHeader with ShowDismiss="false".

[vnbaaij]

Further discussion in the PR #783