Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(ui-text-area): make focus line follow resized textarea #1794

Merged

Conversation

joyenjoyer
Copy link
Contributor

Closes: INSTUI-4380

Test: add the resize property to TextArea component, resize it and observe whether the focusline follows the resizing properly.

@joyenjoyer joyenjoyer requested review from matyasf and balzss November 26, 2024 16:35
@joyenjoyer joyenjoyer self-assigned this Nov 26, 2024
@@ -117,8 +117,8 @@ class TextArea extends Component<TextAreaProps> {
if (this._highlightRef) {
const entryStyle = window.getComputedStyle(entry.target)
this._highlightRef.style.transition = 'none'
this._highlightRef.style.width = `calc(${entryStyle.width}px + 2.125rem)`
this._highlightRef.style.height = `calc(${entryStyle.height}px + 2.125rem)`
this._highlightRef.style.width = `calc(${entryStyle.width} + 0.5rem)`
Copy link
Contributor Author

@joyenjoyer joyenjoyer Nov 26, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

entryStyle.width is a string, which already has 'px' in it. I removed the unneccessary px string from the calc() function and adjusted the proper rem amount.

Copy link

github-actions bot commented Nov 26, 2024

PR Preview Action v1.4.8
Preview removed because the pull request was closed.
2024-12-03 11:15 UTC

Copy link
Collaborator

@matyasf matyasf left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice work!
An extra unit test would be nice, but it might be too tricky

@balzss
Copy link
Contributor

balzss commented Dec 3, 2024

nice work!

@balzss balzss merged commit dd1e12c into master Dec 3, 2024
11 checks passed
@balzss balzss deleted the INSTUI-4380-focus-line-fails-to-adjust-to-resized-text-area branch December 3, 2024 11:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants