[dialog] add options to allow adjustments to focus-trap behavior #11345
Description
Check existing issues
- I have checked for existing issues to avoid duplicates
Description
When using calcite-dialgo with modal prop, it currently prevents the user from clicking on anything that's not contained within the dialog. In the current case we're running into an issue with this is we're using CKEditor inside the calcite-dialog which has certain options that render its own version of a pop over to allow adding link URL. Because this input is being rendered directly on the document body instead of inside the DOM within the dialog content, the user is not able to click to input the URL text or click the cancel or save button within this 3rd party pop over. (Screenshot below)
Blocked issues: #11416, #11420
Acceptance Criteria
I would like to see if there's a prop that can be exposed to allow customizing the calcite-dialog to still maintain focus trap while the user uses keyboard navigation, but allow the user to use the mouse to click on UI elements like this 3rd party pop over even though the DOM elements are not rendered within the calcite-dialog.
Relevant Info
No response
Which Component
calcite-dialog with modal prop
Example Use Case
https://devtopia.esri.com/WebGIS/arcgis-metadata-editor/issues/1537
Priority impact
impact - p3 - not time sensitive
Calcite package
- @esri/calcite-components
- @esri/calcite-components-react
- @esri/calcite-design-tokens
- @esri/calcite-ui-icons
- @esri/eslint-plugin-calcite-components
Esri team
ArcGIS Online