[Panel] popover in panel constrained to panel content

[COV-GIS]

Check existing issues

• I have checked for existing issues to avoid duplicates

Actual Behavior

As of 2.12.0 a popover in a panel is constrained to the content area of the panel excluding the title and footer areas. This can cause unnecessary y overflow/scrolling and the popup not aligning with the header action if trigger thereby.

2.12.0

2.11.1

This is particularly an issue with floating panels that may not have all the necessary height in the content area.

Expected Behavior

Popover should use the entire panel.

Reproduction Sample

https://codepen.io/COV-GIS/pen/RwzBgGW

Reproduction Steps

1. Switch between the 2.11.1 and 2.12.0 resource tags.
2. Click on the gear iconed action.

Reproduction Version

2.12.0

Relevant Info

No response

Regression?

2.11.1

Priority impact

impact - p2 - want for an upcoming milestone

Impact

It would be nice to have this fixed sooner than later.

Calcite package

• @esri/calcite-components
• @esri/calcite-components-angular
• @esri/calcite-components-react
• @esri/calcite-design-tokens
• @esri/eslint-plugin-calcite-components

Esri team

N/A

[geospatialem]

@COV-GIS adding overlay-positioning="fixed" to the popover should mitigate the above: https://codepen.io/geospatialem/pen/vYqaeMo

<calcite-popover auto-close closable heading="Options" scale="s" overlay-positioning="fixed" placement="bottom-end">
    ...
</calcite-popover>

[driskull]

This is due to the setting of the position:relative in this PR: #10117

The way to avoid this is to move the popover outside of the panel. Like so: https://codepen.io/driskull/pen/yLdqPPq?editors=1000

[COV-GIS]

Thanks @geospatialem and @driskull.

I have tried to avoid using fixed positioning unless absolutely necessary. But looks like that will have to be the way to go in this case. Not practical to create a separate popover component to create outside the panel on account of my component having the panel element itself the root of the vnode.

Closing.

---

Can you answer a quick unrelated question @driskull? Why is panel (and by extension dialog) footer now focusable? And only by clicking the footer or heading; but not by tabbing. If it needs to be for accessibility or the like it should also include the top focus:

[macandcheese]

@COV-GIS We should be improving the focus behavior soon, you can track in this related issue: #10022