Sort fields panel position misaligned in full screen view

[bhavyarm]

Kibana version: 8.3.0 snapshot

Elasticsearch version: 8.3.0 snapshot

Server OS version: darwin_x86_64

Browser version: chrome latest

Browser OS version: OS X

Original install method (e.g. download page, yum, from source, etc.): from staging

Describe the bug: If you click open sort field ->clear sorting -> pick fields to sort by -> click on full screen , Kibana displays sort fields panel in the middle of screen in discover full screen.

Plus clicking back on this screen navigates the user away to homescreen instead of discover. ESC works to exit the user from full screen mode.

back_doesnt_work.mp4

[elasticmachine]

Pinging @elastic/kibana-data-discovery (Team:DataDiscovery)

[kertal]

Transferring the issue because it's also reproducible in the EUI docs, so it's not Kibana related

[kertal]

Plus clicking back on this screen navigates the user away to homescreen instead of discover. ESC works to exit the user from full screen mode.

There's an issue for that #4393

[cee-chen]

Looks like this behavior is essentially being caused by the nested EuiPopover behavior. Only one outside click on close event is being triggered.

@cchaos, @miukimiu, can we consider another UI/UX alternative to picking a field to sort by? Can we use an accordion instead for instance, or an EuiContextMenuPanel?

[cchaos]

Honestly, I wonder if there's a good way to combine both column visibility and sort functionality. I don't know if it's enough just to have an initially de-selected button group to visualize sorting. But here's a VERY quick mock that just combines them both without any other thought. The only problem here would be that sort order would now be dependent on column order (but maybe that's not so bad).