Skip to content

fix: forward textarea styles to BaseInput and correct typings #82

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.

Sign up for GitHub

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

Open
QDyanbing wants to merge 1 commit into
base: master
Choose a base branch
from
Open

fix: forward textarea styles to BaseInput and correct typings #82

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@
"coverage": "rc-test --coverage"
},
"dependencies": {
"@rc-component/input": "~1.2.0",
"@rc-component/input": "~1.2.1",
Copy link
Copy Markdown

@coderabbitai coderabbitai bot Mar 17, 2026

Choose a reason for hiding this comment

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

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🌐 Web query:

@rc-component/input 1.2.1 changelog release notes TextArea BaseInput styles clear suffix

💡 Result:

  • There is no @rc-component/input@1.2.1 release in the upstream react-component/input GitHub Releases list. The latest scoped release shown there is @rc-component/input@1.1.2 (Nov 10), so there are no 1.2.1 changelog/release notes for @rc-component/input. [1]
  • What @rc-component/input@1.1.2 release notes contain: only maintenance items (version bump, switching focus util to rc-util, deps cleanup, classnames→clsx, dev-deps bumps). Nothing specifically calling out TextArea, BaseInput, styles, allowClear, suffix, etc. [1]
  • If you’re actually looking for the TextArea/BaseInput “styles / allowClear / suffix” behavior, that API is reflected in the type surface:
    • BaseInputProps/CommonInputProps expose suffix, allowClear, plus classNames and styles for affix/prefix/suffix wrappers. [2]
    • rc-textarea’s TextArea props explicitly pick allowClear and suffix from rc-input’s BaseInputProps. [3]

If you confirm whether you meant rc-input@1.2.1 (unscoped) vs @rc-component/input, I can pull the exact matching release/tag notes for the right package.

Sources: [1] [2] [3]

🏁 Script executed:

# 查看 package.json 第 46 行及其周围上下文
cat -n package.json | sed -n '40,55p'

Repository: react-component/textarea

Length of output: 702

🏁 Script executed:

# 使用 npm 或 registry API 查询 `@rc-component/input` 的所有发布版本
npm view `@rc-component/input` versions --json 2>/dev/null | tail -20 || echo "npm view failed, trying alternative method"

Repository: react-component/textarea

Length of output: 147

依赖升级方向正确，建议确认 1.2.1 版本的具体变更内容。

@rc-component/input 从 ~1.2.0 升级至 ~1.2.1 系 patch 版本更新，与本次样式透传修复目标一致。建议在合并前确认该版本的变更内容（可通过 npm 或源代码仓库查看），确保无隐式行为回归。

🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@package.json` at line 46, The dependency bump for "@rc-component/input" in
package.json was changed to "~1.2.1"; before merging, inspect the 1.2.1
changelog/commit diff (via npm view, GitHub tags/releases, or the package repo)
to confirm the patch only contains the intended style-propagation fix and no
breaking or behavioral changes; if any unexpected changes exist, either pin to
the previous version, add compensating code (e.g., adjust style props handling
in components referencing the Input component), or document the risk in the PR
description referencing "@rc-component/input" and the specific 1.2.1 release
notes.

"@rc-component/resize-observer": "^1.0.0",
"@rc-component/util": "^1.3.0",
"clsx": "^2.1.1"
Expand Down
1 change: 1 addition & 0 deletions src/TextArea.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -236,6 +236,7 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
'data-count': typeof dataCount === 'string' ? dataCount : undefined,
},
}}
styles={styles}
hidden={hidden}
readOnly={readOnly}
onClear={onClear}
Expand Down
2 changes: 1 addition & 1 deletion src/interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export type TextAreaProps = Omit<HTMLTextareaProps, 'onResize' | 'value'> & {
textarea?: string;
count?: string;
};
styles?: {
styles?: CommonInputProps['styles'] & {
textarea?: CSSProperties;
count?: CSSProperties;
};
Expand Down
36 changes: 32 additions & 4 deletions tests/__snapshots__/index.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,38 @@

exports[`TextArea classNames and styles should work 1`] = `
<div>
<textarea
class="rc-textarea custom-textarea custom-class"
style="color: red; background: red;"
/>
<span
class="rc-textarea-affix-wrapper rc-textarea-affix-wrapper-input-with-clear-btn rc-textarea-show-count rc-textarea-textarea-allow-clear custom-class"
data-count="3"
style="background: red;"
>
<textarea
class="rc-textarea custom-textarea"
style="color: red;"
>
123
</textarea>
<span
class="rc-textarea-suffix custom-suffix"
style="color: yellow;"
>
<button
class="rc-textarea-clear-icon rc-textarea-clear-icon-has-suffix custom-clear"
style="color: orange;"
tabindex="-1"
type="button"
>
✖
</button>
suffix
<span
class="rc-textarea-data-count custom-count"
style="color: blue;"
>
3
</span>
</span>
</span>
<span
class="rc-textarea-affix-wrapper rc-textarea-show-count custom-class"
data-count="0"
Expand Down
18 changes: 18 additions & 0 deletions tests/index.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -315,16 +315,28 @@ describe('TextArea', () => {
const { container } = render(
<>
<TextArea
value="123"
showCount
suffix="suffix"
allowClear
className="custom-class"
style={{ background: 'red' }}
classNames={{
textarea: 'custom-textarea',
suffix: 'custom-suffix',
clear: 'custom-clear',
count: 'custom-count',
}}
styles={{
textarea: {
color: 'red',
},
suffix: {
color: 'yellow',
},
clear: {
color: 'orange',
},
count: {
color: 'blue',
},
Expand All @@ -349,6 +361,12 @@ describe('TextArea', () => {
/>
</>,
);
expect(container.querySelector('.rc-textarea-clear-icon')).toHaveClass(
'custom-clear',
);
expect(container.querySelector('.rc-textarea-clear-icon')).toHaveStyle({
color: 'orange',
});
expect(container).toMatchSnapshot();
});

Expand Down
Loading