{"id":21338889,"url":"https://github.com/cybertoothca/ember-cli-textarea-autosize","last_synced_at":"2026-04-06T06:01:54.965Z","repository":{"id":11720313,"uuid":"70213936","full_name":"cybertoothca/ember-cli-textarea-autosize","owner":"cybertoothca","description":"An Ember add-on providing a text-box that autosizes to fit the supplied/keyed content.","archived":false,"fork":false,"pushed_at":"2023-02-22T20:22:36.000Z","size":1181,"stargazers_count":7,"open_issues_count":15,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-11-08T15:54:43.093Z","etag":null,"topics":["autosize","ember-addons","textarea","textarea-component"],"latest_commit_sha":null,"homepage":"http://ember-cli-textarea-autosize.cybertooth.io/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/cybertoothca.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-10-07T03:56:17.000Z","updated_at":"2022-04-07T06:27:31.000Z","dependencies_parsed_at":"2024-06-19T05:25:28.430Z","dependency_job_id":"b4f2035d-19a8-4fa8-abd3-78dcf3bac430","html_url":"https://github.com/cybertoothca/ember-cli-textarea-autosize","commit_stats":{"total_commits":71,"total_committers":7,"mean_commits":"10.142857142857142","dds":0.6619718309859155,"last_synced_commit":"cb6d22b4444b6b3a887a09077e12a99e27b3938b"},"previous_names":[],"tags_count":21,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-textarea-autosize","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-textarea-autosize/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-textarea-autosize/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/cybertoothca%2Fember-cli-textarea-autosize/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/cybertoothca","download_url":"https://codeload.github.com/cybertoothca/ember-cli-textarea-autosize/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225825236,"owners_count":17529905,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["autosize","ember-addons","textarea","textarea-component"],"created_at":"2024-11-22T00:41:06.888Z","updated_at":"2026-04-06T06:01:49.924Z","avatar_url":"https://github.com/cybertoothca.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ember-cli-textarea-autosize\n\n[![npm version](http://badge.fury.io/js/ember-cli-textarea-autosize.svg)](http://badge.fury.io/js/ember-cli-textarea-autosize) ![downloads](https://img.shields.io/npm/dy/ember-cli-textarea-autosize.svg) [![Code Climate](http://codeclimate.com/github/cybertoothca/ember-cli-textarea-autosize/badges/gpa.svg)](http://codeclimate.com/github/cybertoothca/ember-cli-textarea-autosize)\n\n[![ember-observer-badge](http://emberobserver.com/badges/ember-cli-textarea-autosize.svg)](http://emberobserver.com/addons/ember-cli-textarea-autosize)\n\nAn Ember addon that provides a textarea component that adjusts its\nheight according to the supplied text. Included are also several\nmixins that can be used to ensure `autofocus` works properly,\nfocused text inputs have their text selected, and ctrl+enter will\nsubmit the nearest form.\n\nThis addon uses the `autosize.js` library from Jack Moore: [https://github.com/jackmoore/autosize](https://github.com/jackmoore/autosize).\n\n## Compatibility\n\n- Ember.js v3.12 or above\n- Ember CLI v2.13 or above\n- Node.js v10 or above\n\n## Installation\n\n```\nember install ember-cli-textarea-autosize\n\nyarn add -D ember-auto-import webpack\n```\n\n### Dependencies\n\n`ember-auto-import` is being leveraged to bring in Jack Moore's `autosize` library as well as some `keyevent` constants. You don't need to do anything special but make sure your Ember `app` has `ember-auto-import` 2+ installed (which also requires you to install the latest `webpack`).\n\n## Demo\n\nThe demonstration web application can be found here:\n[http://ember-cli-textarea-autosize.cybertooth.io/](http://ember-cli-textarea-autosize.cybertooth.io/).\n\n## What Does This Addon Do?\n\nThis addon gives you access to the following _component_:\n\n- `textarea-autosize` - an extension of the Ember.TextArea that\n  produces a `\u003ctextarea\u003e` that grows in height to fit the supplied\n  content.\n\n## Usage\n\nThis textarea component extends the `ember-cli-text-support-mixins` add-on's\n`text-area` component. This text area does not accept a block, instead always\npass your value to the `value attribute`.\n\n```handlebars\n\u003cTextareaAutosize @value='someModel.largeTextAttribute' /\u003e\n```\n\n### Minimum Height (default is 2 rows)\n\nIf you need to set the minimum height of the `\u003ctextarea\u003e`, set the\n`rows` property:\n\n```handlebars\n\u003cTextareaAutosize rows='6' ... /\u003e\n```\n\n...or you can specify the `min-height` property\n\n```handlebars\n\u003cTextareaAutosize min-height='200px' ... /\u003e\n```\n\n### Maximum Height (when to start scrolling)\n\nThe `\u003ctextarea\u003e` will continue to grow indefinitely unless you set the\n`max-height` property:\n\n```handlebars\n\u003cTextareaAutosize max-height='500px' ... /\u003e\n```\n\n## Extras\n\nThe `\u003cTextareaAutosize /\u003e` automatically:\n\n1. Incorporates a mixin that corrects a quirk in Ember where the\n   `autofocus=true` feature works across template transitions.\n1. Includes a mixin that will select any text when the textarea is\n   focused.\n1. Will attempt to submit the _nearest_ form when `CTRL+ENTER` is\n   pressed.\n\n## Mixins Moved To `ember-cli-text-support-mixins` Add-On\n\nBefore 1.1 the `TriggerFocus`, `FocusSelectsText`, and `CtrlEnterSubmitsForm` mixins\nwere available in this add-on. They are no longer here, and if you were using them your\ncode breaks.\n\nYou should be able to easily move your code over to the `ember-cli-text-support-mixins`\nvariation:\n\n```javascript\n// import TriggerFocus from 'ember-cli-textarea-autosize/mixins/trigger-focus'\n// ...now becomes ...\nimport TriggerFocus from 'ember-cli-text-support-mixins/mixins/trigger-focus';\n\n// import FocusSelectsTextMixin from 'ember-cli-textarea-autosize/mixins/focus-selects-text';\n// ... now becomes ...\nimport FocusSelectsText from 'ember-cli-text-support-mixins/mixins/focus-selects-text';\n\n// import CtrlEnterSubmitsFormMixin from 'ember-cli-textarea-autosize/mixins/ctrl-enter-submits-form';\n// ... now becomes ...\nimport CtrlEnterSubmitsForm from 'ember-cli-text-support-mixins/mixins/ctrl-enter-submits-form';\n```\n\n[Head over here for the mixin documentation](https://github.com/cybertoothca/ember-cli-text-support-mixins#mixins).\n\n## Contributing\n\nSee the [Contributing](CONTRIBUTING.md) guide for details.\n\n## License\n\nThis project is licensed under the [MIT License](LICENSE.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcybertoothca%2Fember-cli-textarea-autosize","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcybertoothca%2Fember-cli-textarea-autosize","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcybertoothca%2Fember-cli-textarea-autosize/lists"}