Add KSelect dropdown to the Overlay layer

[AlexVelezLl]

Description

Finally, a robust solution is proposed to the many known issues with the KSelect dropdown by teleporting KSelect dropdown to the Overlay layer using Popper.

Issue addressed

Addresses #324 and #690.

Before/after screenshots

Before	After
If a modal had a long form, it bugged because of the overflowY: unset set because the Modal check for KSelects	Now, we can have scrollables modals even if it has a KSelect inside

Screencast showing the behaviour of KSelect in a long modal:

Compartir.pantalla.-.2024-12-26.16_10_21.mp4

Changelog

• Description: Teleport KSelect dropdown to the Overlay layer using Popper.

• Products impact: bugfix.

• **Addresses:**Kmodal should be able to show dropdowns select without making scrollbars appear #324, Investigate KSelect’s dropdown being displayed above the input in some cases even when there is enough space below #690.

• Components: KSelect.

• Breaking: no

• Impacts a11y: no

• Guidance: -.

• Description: Removes internal KModal calculations to modify its content height if it had a KSelect inside.

• Products impact: bugfix.

• **Addresses:**Kmodal should be able to show dropdowns select without making scrollbars appear #324.

• Components: KModal.

• Breaking: no

• Impacts a11y: no

• Guidance: -.

Steps to test

1. Step 1
2. Step 2
3. ...

(optional) Implementation notes

At a high level, how did you implement this?

I have decided to close the dropdown on scroll, just like the KDropdownMenu, to avoid situations like this:

Otherwise we would need to be querying scrollable ancestors elements, and taking into account the height of any absolute/fixed elements like the topbar to automaticlly close the dropdown.

Does this introduce any tech-debt items?

Testing checklist

• Contributor has fully tested the PR manually
• If there are any front-end changes, before/after screenshots are included
• Critical and brittle code paths are covered by unit tests
• The change is described in the changelog section above

Reviewer guidance

• Is the code clean and well-commented?
• Are there tests for this change?
• Are all UI components LTR and RTL compliant (if applicable)?
• Add other things to check for here

Comments