autosize-4.0.2/000077500000000000000000000000001327174355100133705ustar00rootroot00000000000000autosize-4.0.2/.gitignore000066400000000000000000000000251327174355100153550ustar00rootroot00000000000000node_modules/* test/*autosize-4.0.2/LICENSE.md000066400000000000000000000020641327174355100147760ustar00rootroot00000000000000The MIT License (MIT) Copyright (c) 2015 Jack Moore Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.autosize-4.0.2/build.js000066400000000000000000000027251327174355100150330ustar00rootroot00000000000000var pkg = require('./package.json'); var fs = require('fs'); var ugly = require('uglify-js'); var jshint = require('jshint').JSHINT; var babel = require('babel-core'); var gaze = require('gaze'); function lint(full) { jshint(full.toString(), { browser: true, undef: true, unused: true, immed: true, eqeqeq: true, eqnull: true, noarg: true, immed: false, predef: ['define', 'module', 'exports', 'Map'] }); if (jshint.errors.length) { jshint.errors.forEach(function (err) { console.log(err.line+':'+err.character+' '+err.reason); }); } else { console.log('linted') } return true; } function build(code) { var minified = ugly.minify(code).code; var header = [ `/*!`, ` ${pkg.name} ${pkg.version}`, ` license: ${pkg.license}`, ` ${pkg.homepage}`, `*/`, `` ].join('\n'); fs.writeFile('dist/'+pkg.name+'.js', header+code); fs.writeFile('dist/'+pkg.name+'.min.js', header+minified); console.log('dist built'); } function transform(filepath) { babel.transformFile(filepath, { plugins: [ "add-module-exports", ["transform-es2015-modules-umd", {"strict": true, "noInterop": true}] ], presets: ["env"], }, function (err,res) { if (err) { return console.log(err); } else { lint(res.code); build(res.code); } }); } gaze('src/'+pkg.name+'.js', function(err, watcher){ // On file changed this.on('changed', function(filepath) { transform(filepath); }); console.log('watching'); }); transform('src/'+pkg.name+'.js');autosize-4.0.2/changelog.md000066400000000000000000000072731327174355100156520ustar00rootroot00000000000000## Changelog ##### v.4.0.2 - 2018-04-30 * More specific detection of when to change overflow. Merges #361. ##### v.4.0.1 - 2018-03-23 * Minor refactor & updated build dependencies ##### v.4.0.0 - 2017-07-12 * Changed how Autosize determines the initial height. Fixes #336. ##### v.3.0.21 - 2017-05-19 * Fixed bug with overflow detection which degraded performance of textareas that exceed their max-width. Fixes #333. ##### v.3.0.20 - 2016-12-04 * Fixed minor bug where the `resized` event would not fire under specific conditions when changing the overflow. ##### v.3.0.19 - 2016-11-23 * Bubble dispatched events. Merged #319. ##### v.3.0.18 - 2016-10-26 * Fixed Firefox issue where calling dispatchEvent on a detached element throws an error. Fixes #317. ##### v.3.0.17 - 2016-7-25 * Fixed Chromium issue where getComputedStyle pixel value did not exactly match the style pixel value. Fixes #306. * Removed undocumented argument, minor refactoring, more comments. ##### v.3.0.16 - 2016-7-13 * Fixed issue with overflowing parent elements. Fixes #298. ##### v.3.0.15 - 2016-1-26 * Used newer Event constructor, when available. Fixes #280. ##### v.3.0.14 - 2015-11-11 * Fixed memory leak on destroy. Merged #271, fixes #270. * Fixed bug in old versions of Firefox (1-5), fixes #246. ##### v.3.0.13 - 2015-09-26 * Fixed scroll-bar jumpiness in iOS. Merged #261, fixes #207. * Fixed reflowing of initial text in Chrome and Safari. ##### v.3.0.12 - 2015-09-14 * Merged changes were discarded when building new dist files. Merged #255, Fixes #257 for real this time. ##### v.3.0.11 - 2015-09-14 * Fixed regression from 3.0.10 that caused an error with ES5 browsers. Merged #255, Fixes #257. ##### v.3.0.10 - 2015-09-10 * Removed data attribute as a way of tracking which elements autosize has been assigned to. fixes #254, fixes #200. ##### v.3.0.9 - 2015-09-02 * Fixed issue with assigning autosize to detached nodes. Merged #253, Fixes #234. ##### v.3.0.8 - 2015-06-29 * Fixed the `autosize:resized` event not being triggered when the overflow changes. Fixes #244. ##### v.3.0.7 - 2015-06-29 * Fixed jumpy behavior in Windows 8.1 mobile. Fixes #239. ##### v.3.0.6 - 2015-05-19 * Renamed 'dest' folder to 'dist' to follow common conventions. ##### v.3.0.5 - 2015-05-18 * Do nothing in Node.js environment. ##### v.3.0.4 - 2015-05-05 * Added options object for indicating if the script should set the overflowX and overflowY. The default behavior lets the script control the overflows, which will normalize the appearance between browsers. Fixes #220. ##### v.3.0.3 - 2015-04-23 * Avoided adjusting the height for hidden textarea elements. Fixes #155. ##### v.3.0.2 - 2015-04-23 * Reworked to respect max-height of any unit-type. Fixes #191. ##### v.3.0.1 - 2015-04-23 * Fixed the destroy event so that it removes its own event handler. Fixes #218. ##### v.3.0.0 - 2015-04-15 * Added new methods for updating and destroying: * autosize.update(elements) * autosize.destroy(elements) * Renamed custom events as to not use jQuery's custom events namespace: * autosize.resized renamed to autosize:resized * autosize.update renamed to autosize:update * autosize.destroy renamed to autosize:destroy ##### v.2.0.1 - 2015-04-15 * Version bump for NPM publishing purposes ##### v.2.0.0 - 2015-02-25 * Smaller, simplier code-base * New API. Example usage: `autosize(document.querySelectorAll(textarea));` * Dropped jQuery dependency * Dropped IE7-IE8 support * Dropped optional parameters * Closes #98, closes #106, closes #123, fixes #129, fixes #132, fixes #139, closes #140, closes #166, closes #168, closes #192, closes #193, closes #197autosize-4.0.2/example/000077500000000000000000000000001327174355100150235ustar00rootroot00000000000000autosize-4.0.2/example/index.html000066400000000000000000000030721327174355100170220ustar00rootroot00000000000000 Simple Autosize for textareas

max-height 300px

no max-height

autosize-4.0.2/package.json000066400000000000000000000017061327174355100156620ustar00rootroot00000000000000{ "name": "autosize", "description": "Autosize is a small, stand-alone script to automatically adjust textarea height to fit text.", "version": "4.0.2", "keywords": [ "textarea", "form", "ui" ], "files": [ "dist", "src" ], "author": { "name": "Jack Moore", "url": "http://www.jacklmoore.com", "email": "hello@jacklmoore.com" }, "main": "dist/autosize.js", "license": "MIT", "homepage": "http://www.jacklmoore.com/autosize", "demo": "http://www.jacklmoore.com/autosize", "repository": { "type": "git", "url": "http://github.com/jackmoore/autosize.git" }, "dependencies": {}, "devDependencies": { "babel-core": "^6.26.0", "babel-plugin-add-module-exports": "^0.2.1", "babel-plugin-transform-es2015-modules-umd": "^6.24.1", "babel-preset-env": "^1.6.1", "gaze": "^1.1.2", "jshint": "^2.9.5", "uglify-js": "^3.3.16" }, "scripts": { "build": "node build" } } autosize-4.0.2/readme.md000066400000000000000000000017661327174355100151610ustar00rootroot00000000000000## Summary Autosize is a small, stand-alone script to automatically adjust textarea height to fit text. #### Demo Full documentation and a demo can be found at [jacklmoore.com/autosize](http://jacklmoore.com/autosize) #### Install via NPM ```bash npm install autosize ``` #### Browser compatibility Chrome | Firefox | IE | Safari | iOS Safari | Android | Opera Mini | Windows Phone IE ------ | --------|----|--------|------------|---------|------------|------------------ yes | yes | 9 | yes | yes | 4 | ? | 8.1 #### Usage The autosize function accepts a single textarea element, or an array or array-like object (such as a NodeList or jQuery collection) of textarea elements. ```javascript // from a NodeList autosize(document.querySelectorAll('textarea')); // from a single Node autosize(document.querySelector('textarea')); // from a jQuery collection autosize($('textarea')); ``` Released under the [MIT License](http://www.opensource.org/licenses/mit-license.php) autosize-4.0.2/src/000077500000000000000000000000001327174355100141575ustar00rootroot00000000000000autosize-4.0.2/src/autosize.js000066400000000000000000000150531327174355100163640ustar00rootroot00000000000000const map = (typeof Map === "function") ? new Map() : (function () { const keys = []; const values = []; return { has(key) { return keys.indexOf(key) > -1; }, get(key) { return values[keys.indexOf(key)]; }, set(key, value) { if (keys.indexOf(key) === -1) { keys.push(key); values.push(value); } }, delete(key) { const index = keys.indexOf(key); if (index > -1) { keys.splice(index, 1); values.splice(index, 1); } }, } })(); let createEvent = (name)=> new Event(name, {bubbles: true}); try { new Event('test'); } catch(e) { // IE does not support `new Event()` createEvent = (name)=> { const evt = document.createEvent('Event'); evt.initEvent(name, true, false); return evt; }; } function assign(ta) { if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA' || map.has(ta)) return; let heightOffset = null; let clientWidth = null; let cachedHeight = null; function init() { const style = window.getComputedStyle(ta, null); if (style.resize === 'vertical') { ta.style.resize = 'none'; } else if (style.resize === 'both') { ta.style.resize = 'horizontal'; } if (style.boxSizing === 'content-box') { heightOffset = -(parseFloat(style.paddingTop)+parseFloat(style.paddingBottom)); } else { heightOffset = parseFloat(style.borderTopWidth)+parseFloat(style.borderBottomWidth); } // Fix when a textarea is not on document body and heightOffset is Not a Number if (isNaN(heightOffset)) { heightOffset = 0; } update(); } function changeOverflow(value) { { // Chrome/Safari-specific fix: // When the textarea y-overflow is hidden, Chrome/Safari do not reflow the text to account for the space // made available by removing the scrollbar. The following forces the necessary text reflow. const width = ta.style.width; ta.style.width = '0px'; // Force reflow: /* jshint ignore:start */ ta.offsetWidth; /* jshint ignore:end */ ta.style.width = width; } ta.style.overflowY = value; } function getParentOverflows(el) { const arr = []; while (el && el.parentNode && el.parentNode instanceof Element) { if (el.parentNode.scrollTop) { arr.push({ node: el.parentNode, scrollTop: el.parentNode.scrollTop, }) } el = el.parentNode; } return arr; } function resize() { if (ta.scrollHeight === 0) { // If the scrollHeight is 0, then the element probably has display:none or is detached from the DOM. return; } const overflows = getParentOverflows(ta); const docTop = document.documentElement && document.documentElement.scrollTop; // Needed for Mobile IE (ticket #240) ta.style.height = ''; ta.style.height = (ta.scrollHeight+heightOffset)+'px'; // used to check if an update is actually necessary on window.resize clientWidth = ta.clientWidth; // prevents scroll-position jumping overflows.forEach(el => { el.node.scrollTop = el.scrollTop }); if (docTop) { document.documentElement.scrollTop = docTop; } } function update() { resize(); const styleHeight = Math.round(parseFloat(ta.style.height)); const computed = window.getComputedStyle(ta, null); // Using offsetHeight as a replacement for computed.height in IE, because IE does not account use of border-box var actualHeight = computed.boxSizing === 'content-box' ? Math.round(parseFloat(computed.height)) : ta.offsetHeight; // The actual height not matching the style height (set via the resize method) indicates that // the max-height has been exceeded, in which case the overflow should be allowed. if (actualHeight < styleHeight) { if (computed.overflowY === 'hidden') { changeOverflow('scroll'); resize(); actualHeight = computed.boxSizing === 'content-box' ? Math.round(parseFloat(window.getComputedStyle(ta, null).height)) : ta.offsetHeight; } } else { // Normally keep overflow set to hidden, to avoid flash of scrollbar as the textarea expands. if (computed.overflowY !== 'hidden') { changeOverflow('hidden'); resize(); actualHeight = computed.boxSizing === 'content-box' ? Math.round(parseFloat(window.getComputedStyle(ta, null).height)) : ta.offsetHeight; } } if (cachedHeight !== actualHeight) { cachedHeight = actualHeight; const evt = createEvent('autosize:resized'); try { ta.dispatchEvent(evt); } catch (err) { // Firefox will throw an error on dispatchEvent for a detached element // https://bugzilla.mozilla.org/show_bug.cgi?id=889376 } } } const pageResize = () => { if (ta.clientWidth !== clientWidth) { update(); } }; const destroy = (style => { window.removeEventListener('resize', pageResize, false); ta.removeEventListener('input', update, false); ta.removeEventListener('keyup', update, false); ta.removeEventListener('autosize:destroy', destroy, false); ta.removeEventListener('autosize:update', update, false); Object.keys(style).forEach(key => { ta.style[key] = style[key]; }); map.delete(ta); }).bind(ta, { height: ta.style.height, resize: ta.style.resize, overflowY: ta.style.overflowY, overflowX: ta.style.overflowX, wordWrap: ta.style.wordWrap, }); ta.addEventListener('autosize:destroy', destroy, false); // IE9 does not fire onpropertychange or oninput for deletions, // so binding to onkeyup to catch most of those events. // There is no way that I know of to detect something like 'cut' in IE9. if ('onpropertychange' in ta && 'oninput' in ta) { ta.addEventListener('keyup', update, false); } window.addEventListener('resize', pageResize, false); ta.addEventListener('input', update, false); ta.addEventListener('autosize:update', update, false); ta.style.overflowX = 'hidden'; ta.style.wordWrap = 'break-word'; map.set(ta, { destroy, update, }); init(); } function destroy(ta) { const methods = map.get(ta); if (methods) { methods.destroy(); } } function update(ta) { const methods = map.get(ta); if (methods) { methods.update(); } } let autosize = null; // Do nothing in Node.js environment and IE8 (or lower) if (typeof window === 'undefined' || typeof window.getComputedStyle !== 'function') { autosize = el => el; autosize.destroy = el => el; autosize.update = el => el; } else { autosize = (el, options) => { if (el) { Array.prototype.forEach.call(el.length ? el : [el], x => assign(x, options)); } return el; }; autosize.destroy = el => { if (el) { Array.prototype.forEach.call(el.length ? el : [el], destroy); } return el; }; autosize.update = el => { if (el) { Array.prototype.forEach.call(el.length ? el : [el], update); } return el; }; } export default autosize;