cds control text overlaps with actions if initial display is hidden

[ambar-arkin]

Describe the bug

If initial display property of container is hidden and later changed to something else.
The cds control actions overlap with input text.

How to reproduce

https://stackblitz.com/edit/vitejs-vite-qng22i?file=src/App.jsx

Steps to reproduce the behavior:

1. Uncheck hidden checkbox
2. Type something long in text and search input
3. See the text overlap with prefix and suffix actions

Expected behavior

The input text should start after the prefix action and end before it.

Versions

Clarity project:

• Clarity Core
• Clarity Angular/UI

Clarity version:

• v5.x
• v6.x

Framework:

• Angular
• React
• Vue
• Other:

Framework version:
React 18

Device:

• Type: M1 Macbook pro
• OS: macOS
• Browser chromium
• Version 106

Additional notes

This happens due to getBoundingClientRect giving unexpected result when display is none.

core/projects/core/src/forms/control/control.element.ts

Line 353 in 17b5842

const start = pxToRem(this.prefixAction.getBoundingClientRect().width + 6);

[github-actions]

🎉 This issue has been resolved in version 6.2.1 🎉

The release is available on:

• GitHub release
• v6.2.1

Your semantic-release bot 📦🚀

[github-actions]

Hi there 👋, this is an automated message. To help Clarity keep track of discussions, we automatically lock closed issues after 14 days. Please look for another open issue or open a new issue with updated details and reference this one as necessary.