What is a good approach for warning user on leaving a modal or side flyout panel with unsaved changes?
The user is editing a form element on the RHS flyout panel and the editing is not completed. In the middle of the process, the user decides to undertake the following actions:
- Click outside the flyout panel.
- Click in the search bar.
- Click on one of the tabs inside the flyout
- Clicks on the flyout close button.
What is the best way to notify the user that their changes will not be saved? Here are some of my iterations:
