rc-textarea

rc-textarea is the low-level React textarea component that powers Input.TextArea in Ant Design, providing auto-resize behavior, resize-event callbacks, and enter-key handling on top of a plain <textarea> element. Its signature feature is autoSize, which can be toggled on or off, or configured with minRows/maxRows so the textarea grows and shrinks with its content within defined bounds instead of showing a scrollbar or a fixed-height box.

As part of the react-component organization (the shared component foundation used across Ant Design’s ecosystem, including antd and antd-mobile), rc-textarea is designed to be themed via a configurable prefixCls and consumed either directly or through a higher-level wrapper component that adds design-system styling on top.

What You Get

• Drop-in <Textarea /> React component wrapping a native <textarea> element
• autoSize prop (boolean or {minRows, maxRows} object) for content-driven height adjustment
• onResize callback reporting {width, height} whenever the textarea’s dimensions change
• onPressEnter callback for handling the Enter key without manually attaching a keydown listener
• Configurable prefixCls for integrating with a design system’s CSS class naming convention

Common Use Cases

• Building a chat or comment input that grows with typed content up to a maximum number of rows
• Implementing Ant Design’s Input.TextArea component or a similarly themed custom textarea
• Tracking textarea resize events to reflow surrounding layout (e.g. adjusting a sticky toolbar’s position)

Under The Hood

Architecture The component is split across a small set of files: TextArea.tsx is the public-facing component managing controlled/uncontrolled value state and exposing the documented props, ResizableTextArea.tsx wraps the native <textarea> and applies auto-sizing logic plus a ResizeObserver-driven resize callback, and calculateNodeHeight.tsx implements the actual height calculation by cloning the textarea’s computed styles into a hidden mirror element to measure scrollHeight accurately across browsers. interface.ts centralizes the shared TypeScript prop types. Tech Stack Written in TypeScript/TSX with rc-util’s shared hooks and ref-merging helpers (typical of the react-component ecosystem) as its main dependency, built with the standard react-component tooling (father/dumi) for compiling to CJS/ESM and generating the live documentation site. Code Quality The project has CI-enforced tests with Codecov coverage reporting (badges in the README reference GitHub Actions and Codecov), and its release history shows two parallel version lines — the legacy rc-textarea semver line and a newer @rc-component/textarea scoped package — reflecting an in-progress migration within the react-component org to scoped package names. API Design The prop surface (autoSize, onResize, onPressEnter, prefixCls) is deliberately minimal and unstyled, leaving visual presentation to a consuming design system; this keeps the component reusable outside Ant Design specifically, at the cost of requiring consumers to supply their own CSS for anything beyond the bare textarea’s default browser styling.