react-textarea-autosize

WebJar for react-textarea-autosize

License

License

MIT
Categories

Categories

React User Interface Web Frameworks Auto Application Layer Libs Code Generators
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

react-textarea-autosize
Last Version

Last Version

3.3.0
Release Date

Release Date

Type

Type

jar
Description

Description

react-textarea-autosize
WebJar for react-textarea-autosize
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/andreypopp/react-textarea-autosize

Download react-textarea-autosize

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/react-textarea-autosize/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>react-textarea-autosize</artifactId>
    <version>3.3.0</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/react-textarea-autosize/
implementation 'org.webjars.bower:react-textarea-autosize:3.3.0'
// https://jarcasting.com/artifacts/org.webjars.bower/react-textarea-autosize/
implementation ("org.webjars.bower:react-textarea-autosize:3.3.0")
'org.webjars.bower:react-textarea-autosize:jar:3.3.0'
<dependency org="org.webjars.bower" name="react-textarea-autosize" rev="3.3.0">
  <artifact name="react-textarea-autosize" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='react-textarea-autosize', version='3.3.0')
)
libraryDependencies += "org.webjars.bower" % "react-textarea-autosize" % "3.3.0"
[org.webjars.bower/react-textarea-autosize "3.3.0"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

npm version npm

react-textarea-autosize

Drop-in replacement for the textarea component which automatically resizes textarea as content changes. A native React version of the popular jQuery Autosize! Weighs around 1.3KB (minified & gzipped).

This module supports IE9 and above.

import TextareaAutosize from 'react-textarea-autosize';

// If you use CommonJS syntax:
// var TextareaAutosize = require('react-textarea-autosize').default;

React.renderComponent(
  <div>
    <TextareaAutosize />
  </div>,
  document.getElementById('element'),
);

Install

npm install react-textarea-autosize

Demo

https://andarist.github.io/react-textarea-autosize/

Props

Special props:

prop type description
maxRows number Maximum number of rows up to which the textarea can grow
minRows number Minimum number of rows to show for textarea
onHeightChange func Function invoked on textarea height change, with height as first argument. The second function argument is an object containing additional information that might be useful for custom behaviors. Current options include { rowHeight: number }.
cacheMeasurements boolean Reuse previously computed measurements when computing height of textarea. Default: false

Apart from these, the component accepts all props that are accepted by <textarea/>, like style, onChange, value, etc.

FAQ

How to focus

Get a ref to inner textarea:

<TextareaAutosize ref={(tag) => (this.textarea = tag)} />

And then call a focus on that ref:

this.textarea.focus();

To autofocus:

<TextareaAutosize autoFocus />

(all HTML attributes are passed to inner textarea)

How to test it with jest and react-test-renderer if you need ref

Because jest provides polyfills for DOM objects by requiring jsdom and react-test-renderer doesn't provide refs for rendered components out of the box (calling ref callbacks with null), you need to supply a mocked ref in your tests in you need it for your tests. You can do it like this (more can be read here):

const tree = renderer
  .create(<TextareaAutosize />, {
    createNodeMock: () => document.createElement('textarea'),
  })
  .toJSON();

Versions

Version
3.3.0
1.1.0