TextareaAutosize

TextareaAutosize is a textarea that measures its content and adjusts its height on every input, so it expands as the user types and never shows an inner scrollbar until it hits maxRows. Bound the growth with minRows and maxRows (defaults 2 and 8). It forwards its ref and accepts all native textarea props, making it ideal for chat composers and comment boxes.

Example

import { TextareaAutosize } from '@officina/ui';
import { useState } from 'react';

function Example() {
  const [value, setValue] = useState('');
  return (
    <TextareaAutosize
      minRows={2}
      maxRows={8}
      placeholder="Write a message…"
      value={value}
      onChange={(e) => setValue(e.target.value)}
    />
  );
}

API