Auto-sizing TextareaSurface for famo.us

Usage no npm install needed!

<script type="module">
  import famousAutosizetextarea from 'https://cdn.skypack.dev/famous-autosizetextarea';



Auto-sizing TextareaSurface for famo.us.


TextareaSurface for famo.us that emits an event everytime the 'ideal' height for fitting the content changes. This event can then be used to set the size of the Surface to fit the content. AutosizeTextareaSurface is inherited from TextareaSurface.


Getting started

Install using bower or npm:

bower install famous-autosizetextarea

npm install famous-autosizetextarea

Auto-sizing a text-area

AutosizeTextareaSurface emits an event whenever the ideal height changes. Use this event to set the size, or set the size of the parent container.

var AutosizeTextareaSurface = require('famous-autosizetextarea/AutosizeTextareaSurface');

// create text-area
var textArea = new AutosizeTextareaSurface({
    classes: ['mytextarea'],
    size: [undefined, 30] // initial size

// automatically resize text-area when typed text changes
textArea.on('scrollHeightChanged', function(scrollHeight) {
    textArea.setSize([undefined, scrollHeight]);

// use `getScrollHeight` to obtain the ideal height
var scrollHeight = textArea.getScrollHeight();
console.log('current ideal height is: ' + scrollHeight);


If you like this project and want to support it, show some love and give it a star.


© 2014 - 2015 - Hein Rutjes