Ninety-nine Pitchers of Malt
    Wondering what’s next for npm?Check out our public roadmap! »

    fit-textarea
    TypeScript icon, indicating that this package has built-in type declarations

    3.0.0 • Public • Published

    fit-textarea

    Automatically expand a <textarea> to fit its content, in a few bytes

    Try the demo!

    Features:

    • Small
    • No layout thrashing (no DOM changes unless necessary)
    • You can set a minimum height (via rows attribute or height CSS property)
    • If the field is resizable, the new size will be treated as minimum height

    Install

    npm install fit-textarea
    

    Setup

    // This module is only offered as a ES Module
    import fitTextarea from 'fit-textarea';
    <textarea rows="3">Use the rows attribute to set its minimum height</textarea>

    Usage

    Once, one element

    const textarea = document.querySelector('textarea');
    fitTextarea(textarea);

    As the user types

    One element

    const textarea = document.querySelector('textarea');
    fitTextarea.watch(textarea);

    Array/NodeList/Iterable of elements

    const textareas = document.querySelectorAll('textarea');
    fitTextarea.watch(textareas);

    With a selector

    The selector is run once, so it's equivalent to the example above.

    fitTextarea.watch('textarea');

    Related

    • indent-textarea - Add editor-like tab-to-indent functionality to <textarea>, in a few bytes.
    • delegate-it - DOM event delegation, in <1KB. Can be used to attach one fit-textarea to many elements.
    • Refined GitHub - Uses this module.

    Install

    npm i fit-textarea

    DownloadsWeekly Downloads

    860

    Version

    3.0.0

    License

    MIT

    Unpacked Size

    6.62 kB

    Total Files

    5

    Last publish

    Collaborators

    • avatar