React textarea grows but doesn't shrink, how to make it shrink?

Question

I have this React component, which successfully grows the textarea.

.textarea {
  resize: none;
  overflow: hidden;
  box-sizing: border-box;
}


export default function Textarea({
  className,
  onChange,
  defaultValue,
  ...attrs
}) {
  const handleInput = (e) => {
    const h = e.target.scrollHeight
    e.target.style.height = '0px'
    e.target.style.height = `${h}px`
    onChange?.(e)
  }

  return (
    <textarea {...attrs} defaultValue={defaultValue} onInput={handleInput} className={styles.textarea} />
  )
}

How do I get it to shrink though, it only grows?