Skip to content

Conversation

@nuke-ellington
Copy link
Collaborator

💡 What is the current behavior?

  • Unit conversion issues: The textareaWidth and textareaHeight properties only accepted raw values without proper unit conversion support for rem, em, %, or unitless values.

  • CSS height conflicts: When using the rows attribute, there was a conflict with the fixed height: 3.25rem CSS rule, preventing the browser's natural height calculation based on row count.

GitHub Issue Number: #1975

🆕 What is the new behavior?

  • Enhanced unit conversion: Added comprehensive convertToPx() method that handles px, rem, em, %, and unitless values with proper error handling and case-insensitive unit detection.

  • Improved CSS styling: Modified textarea mixin to conditionally apply fixed height only when rows attribute is not present [&:not([rows]), allowing natural browser sizing when rows are specified.

  • Robust dimension handling: Enhanced resize behavior management with proper fallbacks ('auto' for height, '100%' for width) and improved manual resize state preservation.

  • Comprehensive test coverage: Added extensive component tests covering unit conversion, dimension interactions, resize behavior, and edge cases.

🏁 Checklist

A pull request can only be merged if all of these conditions are met (where applicable):

  • 🦮 Accessibility (a11y) features were implemented
  • 🗺️ Internationalization (i18n) - no hard coded strings
  • 📲 Responsiveness - components handle viewport changes and content overflow gracefully
  • 📕 Add or update a Storybook story
  • 📄 Documentation was reviewed/updated siemens/ix-docs
  • 🧪 Unit tests were added/updated and pass (pnpm test)
  • 📸 Visual regression tests were added/updated and pass (Guide)
  • 🧐 Static code analysis passes (pnpm lint)
  • 🏗️ Successful compilation (pnpm build, changes pushed)

👨‍💻 Help & support

@changeset-bot
Copy link

changeset-bot bot commented Dec 3, 2025

🦋 Changeset detected

Latest commit: d2bc9ae

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages
Name Type
@siemens/ix Patch
@siemens/ix-angular Patch
@siemens/ix-docs Patch
@siemens/ix-react Patch
@siemens/ix-vue Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@nuke-ellington nuke-ellington added this to the 4.2.0 milestone Dec 3, 2025
@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello @nuke-ellington, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request significantly improves the ix-textarea component by enhancing its dimension handling capabilities. It introduces a robust unit conversion mechanism for textareaWidth and textareaHeight properties, allowing developers to specify dimensions using various CSS units or unitless values. Furthermore, it resolves a long-standing conflict between the rows attribute and fixed CSS height, enabling more predictable and flexible textarea sizing. The changes also include better management of manual resizing and comprehensive test coverage to ensure reliability.

Highlights

  • Enhanced Unit Conversion: Implemented a convertToPx() method to correctly interpret and convert textareaWidth and textareaHeight values specified in px, rem, em, %, and unitless formats.
  • Resolved CSS Height Conflict: Modified the textarea CSS mixin to ensure that the rows attribute can naturally determine the textarea's height without conflicting with a fixed height style.
  • Improved Dimension Handling: Introduced robust fallbacks for textareaHeight ('auto') and textareaWidth ('100%') and ensured manual resize state preservation.
  • Comprehensive Test Coverage: Added extensive component tests to validate unit conversion, dimension interactions, resize behavior, and edge cases.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

This pull request effectively addresses the initial goals of improving unit handling and resolving CSS conflicts for the ix-textarea component. The new convertToPx function is a good addition, and the test suite is quite comprehensive. However, I've identified a critical bug in the percentage height calculation within convertToPx and a corresponding gap in the test coverage. My review includes a detailed explanation of the bug and suggestions for refactoring and improving the tests.

@nuke-ellington nuke-ellington marked this pull request as draft December 3, 2025 09:13
@nuke-ellington
Copy link
Collaborator Author

/Gemini review

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

This pull request does a great job of fixing the unit conversion issues for textareaWidth and textareaHeight by introducing a new convertToPx utility. The SCSS change to correctly handle the rows attribute is also a key fix. The addition of comprehensive component tests is excellent and covers many edge cases, including manual resizing and prop updates. I have a couple of suggestions to make the new convertToPx utility even more robust by using a regular expression for parsing, which will handle more edge cases correctly.

@nuke-ellington nuke-ellington marked this pull request as ready for review December 9, 2025 09:44
@sonarqubecloud
Copy link

sonarqubecloud bot commented Dec 9, 2025

@nuke-ellington nuke-ellington modified the milestones: 4.2.0, 4.3.0 Dec 10, 2025
@nuke-ellington nuke-ellington modified the milestones: 4.3.0, 4.4.0 Feb 4, 2026
@sonarqubecloud
Copy link

sonarqubecloud bot commented Feb 4, 2026

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.

2 participants