Auto-resize a textarea based on its content (Vue 3 composition API)

useAutoresizeTextarea.js

import { watchEffect } from "vue"

export const useAutoresizeTextarea = (element) => {
    const resizeTextarea = () => {
        element.value.style.height = 'auto'
        element.value.style.height = element.value.scrollHeight + 'px'
    }

    watchEffect(onInvalidate => {
        if (! element.value) return
        resizeTextarea()
        element.value.addEventListener('input', resizeTextarea)
        onInvalidate(() => element.value?.removeEventListener('input', resizeTextarea))
    })
}