## Description
This PR primarily adds the modal widget to WDS.
The following changes were made:
1. WidgetNameCanvas now listens to modal body scrolls to position widget
name components correctly
2. Modal Widget is rendered as a detached widget that is outside of the
layout flow of the main canvas
3. Main container resizer now has a higher z-index to show even if the
modal is open in the preview mode
4. Widget selection flow in Anvil layout system has been modified to be
handled in a central location (`AnvilMainCanvas`)
5. Modal widget's type in modal sagas are selected via a selector that
checks for the feature flag.
6. Modal widget has its own preset that (at present) is similar to the
Main container's layout preset
#### PR fixes following issue(s)
Fixes#28588Fixes#28328Fixes#27459
#### Media
https://github.com/appsmithorg/appsmith/assets/103687/bf350be4-2202-49f3-a860-3e38681ab32e
#### Type of change
- New feature (non-breaking change which adds functionality)
- This change requires a documentation update
## Testing
>
#### How Has This Been Tested?
- [x] Manual
- [ ] JUnit
- [ ] Jest
- [ ] Cypress
## Checklist:
#### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag
#### QA activity:
- [ ] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [ ] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Enhanced Modal components with additional styling and customization
options.
- Introduced a new event type for modal submission actions.
- Added a `--on-canvas-ui-z-index` CSS variable for improved layering
control.
- Implemented a new method for widget focus management in the editor.
- **Improvements**
- Modal components now use context hooks for close actions.
- Improved the handling of detached widgets in various layout systems.
- Simplified the drag-and-drop state management for widgets.
- Upgraded the visual presentation of the widget drop area.
- Enhanced widget selection with new custom event dispatching.
- Updated the modal widget configuration with default settings and
property pane structure.
- **Bug Fixes**
- Fixed an issue with modal scrolling to behave consistently with the
main container.
- Addressed a problem where the `id` was not found during layout element
position updates.
- **Style**
- Adjusted modal overlay positioning and content width with new CSS
standards.
- Updated zIndex references to use CSS variables for consistent styling.
- **Refactor**
- Reorganized the `Widgets` array into categorized groups for better
clarity.
- Simplified the `modalPreset` function's parameters and layout
declaration.
- **Documentation**
- Added default values for feature flags in the documentation.
- **Chores**
- Altered feature flags to enable new functionalities by default.
- **Tests**
- No visible changes to end-users in this category.
- **Revert**
- No visible changes to end-users in this category.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Preet Sidhu <preetsidhu.bits@gmail.com>
Co-authored-by: Valera Melnikov <valera@appsmith.com>