Skip to content
Open
Show file tree
Hide file tree
Changes from 13 commits
Commits
Show all changes
29 commits
Select commit Hold shift + click to select a range
1566ff1
Added fix for textarea rows and textarea width
varun-srinivasa Jul 29, 2025
51f21ea
fixed lint
varun-srinivasa Jul 29, 2025
79b69fa
updated failing VRT
varun-srinivasa Jul 29, 2025
7819f60
Merge branch 'main' into textArea
varun-srinivasa Jul 29, 2025
928c9f6
Update component-doc.json
varun-srinivasa Jul 29, 2025
1a3a41a
updated failing componentdoc
varun-srinivasa Jul 30, 2025
9e77b15
Merge branch 'textArea' of https://github.com/varun-srinivasa/ix intoโ€ฆ
varun-srinivasa Jul 30, 2025
30327fc
Delete packages/core/component-doc.json
varun-srinivasa Jul 30, 2025
80d7989
Merge branch 'main' of https://github.com/varun-srinivasa/ix into texโ€ฆ
varun-srinivasa Jul 31, 2025
8b38b77
Merge branch 'textArea' of https://github.com/varun-srinivasa/ix intoโ€ฆ
varun-srinivasa Jul 31, 2025
1670bc5
Updated css to match width
varun-srinivasa Aug 4, 2025
ea14786
Updated VRT
varun-srinivasa Aug 5, 2025
7f35f11
Merge branch 'main' into textArea
varun-srinivasa Aug 5, 2025
ef1301a
updated component-doc.json
varun-srinivasa Aug 6, 2025
73ea18b
Merge branch 'textArea' of https://github.com/varun-srinivasa/ix intoโ€ฆ
varun-srinivasa Aug 6, 2025
6990aa6
Merge branch 'main' into textArea
varun-srinivasa Aug 11, 2025
8dffbdf
updated component tests
varun-srinivasa Aug 20, 2025
0c16634
fixed lint error
varun-srinivasa Aug 20, 2025
04a5f11
Merge branch 'main' into textArea
varun-srinivasa Sep 12, 2025
aef6d6f
Create tasty-cups-argue.md
nuke-ellington Oct 15, 2025
bc51846
Merge branch 'main' into textArea
varun-srinivasa Oct 16, 2025
bc00a4c
updated textarea as per comments
varun-srinivasa Oct 16, 2025
0fb17a8
Merge branch 'main' into textArea
varun-srinivasa Nov 10, 2025
17502c7
Merge branch 'main' of https://github.com/varun-srinivasa/ix into texโ€ฆ
varun-srinivasa Nov 11, 2025
65f144b
resolved merge conflicts
varun-srinivasa Nov 11, 2025
4aae78c
Merge branch 'textArea' of https://github.com/varun-srinivasa/ix intoโ€ฆ
varun-srinivasa Nov 11, 2025
55588e9
resolved merge conflicts
varun-srinivasa Nov 11, 2025
0754b6b
updated textarea logic
varun-srinivasa Nov 14, 2025
843103f
Merge remote-tracking branch 'origin/main' into textArea
danielleroux Nov 27, 2025
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28,545 changes: 0 additions & 28,545 deletions packages/core/component-doc.json

This file was deleted.

1 change: 0 additions & 1 deletion packages/core/scss/mixins/_input.scss
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,6 @@
@mixin element-textarea {
& {
min-height: 2rem;
height: 3.25rem;
padding: calc(0.375rem - var(--theme-input--border-thickness))
calc(0.5rem - var(--theme-input--border-thickness));
}
Expand Down
18 changes: 18 additions & 0 deletions packages/core/src/components/input/textarea.scss
Original file line number Diff line number Diff line change
Expand Up @@ -54,3 +54,21 @@
border-color: var(--theme-input--border-color--invalid--active) !important;
}
}

:host {
textarea:not([rows]) {
height: 3.25rem;
}
}
:host([textarea-width]) {
display: block;
width: var(--textarea-width);
}

.input-wrapper {
width: 100%;
}

textarea {
width: 100%;
}
7 changes: 7 additions & 0 deletions packages/core/src/components/input/textarea.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -174,6 +174,13 @@ export class Textarea implements IxInputFieldComponent<string> {

componentWillLoad() {
this.updateFormInternalValue(this.value);
if (this.textareaWidth) {
this.hostElement.style.setProperty(
'--textarea-width',
this.textareaWidth
);
this.hostElement.setAttribute('textarea-width', '');
}
Comment on lines 246 to 255
Copy link
Contributor

Choose a reason for hiding this comment

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

high

There are a couple of issues with the implementation for textareaWidth:

  1. Dynamic updates are not handled: This logic only runs when the component loads. If the textareaWidth prop is changed dynamically after the component has been mounted, the width will not update. To fix this, you should handle property changes using a @Watch('textareaWidth') decorator. I suggest extracting this logic into a private method and calling it from both componentWillLoad and the new watcher method.

    Example:

    @Watch('textareaWidth')
    onTextareaWidthChange() {
      this.setTextareaWidth();
    }
    
    // In componentWillLoad, replace the current logic with:
    this.setTextareaWidth();
    
    private setTextareaWidth() {
      if (this.textareaWidth) {
        this.hostElement.style.setProperty('--textarea-width', this.textareaWidth);
        this.hostElement.setAttribute('textarea-width', '');
      } else {
        this.hostElement.style.removeProperty('--textarea-width');
        this.hostElement.removeAttribute('textarea-width');
      }
    }
  2. Conflicting width styles: The textareaWidth prop is still passed to TextareaElement and applied as an inline width style on the <textarea> element in packages/core/src/components/input/input.fc.tsx. This will override the width: 100% from the stylesheet and cause incorrect layout. You should remove the width: props.textareaWidth from the style object in TextareaElement to allow the textarea to correctly fill its container.

}

updateFormInternalValue(value: string) {
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading