[data table and popover in toolbar webcomponents]: popover content is not shown the same way as overflow-menu webcomponents

[DoofisS]

Description

I am trying to add popover to data table toolbar as on the screenshot

and the problem is that the popover content is cropped by the toolbar but at the same time oevrflow-menu is working fine and it content shown in a proper way



on those two images you can see the variant in which button inside the popover like in docs and the button outside of the popover
also in docs there is simple button and not the <cds-button> here the example <button aria-label="Settings" type="button">${Settings16()}</button>

also would be cool to make popover work the same way as overflow menu, so you don't need to create button and functions to open/close it

Component(s) impacted

data table, popover

Browser

No response

Carbon for IBM.com version

@carbon/web-components 2.12.0

Severity

Severity 1 = The design is broken in a critical way that blocks users from completing tasks or damages the brand. Affects major functionality, no workaround.

Application/website

Any project with dt and popover

Package

@carbon/web-components

CodeSandbox example

https://codesandbox.io/p/sandbox/sad-snow-9lx9ct?file=%2Findex.html

Steps to reproduce the issue (if applicable)

add popover to data table toolbar

Release date (if applicable)

No response

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate issues