diff --git a/NOTICE.txt b/NOTICE.txt index 092ce0cc8a..7d0b16ff73 100644 --- a/NOTICE.txt +++ b/NOTICE.txt @@ -1284,37 +1284,6 @@ limitations under the License. --- -This product contains a modified portion of 'react-autosize-textarea', a light replacement for built-in textarea component which automaticaly adjusts its height to match the content. - -* HOMEPAGE: - * https://github.com/buildo/react-autosize-textarea - -* LICENSE: - -The MIT License (MIT) - -Copyright (c) 2016 buildo s.r.l.s. - -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. - ---- - This product contains a modified portion of 'compass-mixins', which pulls SASS style sheets on Bower, and enjoys the compass mixins by using libsass for faster compilation, by Christopher M. Eppstein. * HOMEPAGE: diff --git a/webapp/components/autosize_textarea.jsx b/webapp/components/autosize_textarea.jsx new file mode 100644 index 0000000000..45807fda0b --- /dev/null +++ b/webapp/components/autosize_textarea.jsx @@ -0,0 +1,90 @@ +// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import React from 'react'; + +export default class AutosizeTextarea extends React.Component { + static propTypes = { + value: React.PropTypes.string, + placeholder: React.PropTypes.string, + onHeightChange: React.PropTypes.func + } + + constructor(props) { + super(props); + + this.height = 0; + } + + get value() { + return this.refs.textarea.value; + } + + set value(value) { + this.refs.textarea.value = value; + } + + componentDidUpdate() { + this.recalculateSize(); + } + + recalculateSize() { + const height = this.refs.reference.scrollHeight; + + if (height > 0 && height !== this.height) { + const textarea = this.refs.textarea; + + const style = getComputedStyle(textarea); + const borderWidth = parseInt(style.borderTopWidth, 10) + parseInt(style.borderBottomWidth, 10); + + // Directly change the height to avoid circular rerenders + textarea.style.height = String(height + borderWidth) + 'px'; + + this.height = height; + + if (this.props.onHeightChange) { + this.props.onHeightChange(height, parseInt(style.maxHeight, 10)); + } + } + } + + getDOMNode() { + return this.refs.textarea; + } + + render() { + window.forceUpdate = this.forceUpdate.bind(this); + const { + value, + placeholder, + ...otherProps + } = this.props; + + const heightProps = {}; + if (this.height <= 0) { + // Set an initial number of rows so that the textarea doesn't appear too large when its first rendered + heightProps.rows = 1; + } else { + heightProps.height = this.height; + } + + return ( +
+