diff --git a/index.d.ts b/index.d.ts index dc039d794a..0fa1ee3080 100644 --- a/index.d.ts +++ b/index.d.ts @@ -4,7 +4,7 @@ export { default as Portal, PortalProps } from './dist/commonjs/addons/Portal'; export { default as Radio, RadioProps } from './dist/commonjs/addons/Radio'; export { default as Ref, RefProps } from './dist/commonjs/addons/Ref'; export { default as Select, SelectProps } from './dist/commonjs/addons/Select'; -export { default as TextArea, TextAreaProps, TextAreaOnChangeData } from './dist/commonjs/addons/TextArea'; +export { default as TextArea, TextAreaProps } from './dist/commonjs/addons/TextArea'; // Behaviors export { diff --git a/src/addons/TextArea/TextArea.d.ts b/src/addons/TextArea/TextArea.d.ts index 9e3e919359..32f8ffff62 100644 --- a/src/addons/TextArea/TextArea.d.ts +++ b/src/addons/TextArea/TextArea.d.ts @@ -15,7 +15,15 @@ export interface TextAreaProps { * @param {SyntheticEvent} event - The React SyntheticEvent object * @param {object} data - All props and the event value. */ - onChange?: (event: React.FormEvent, data: TextAreaOnChangeData) => void; + onChange?: (event: React.FormEvent, data: TextAreaProps) => void; + + /** + * Called on input. + * + * @param {SyntheticEvent} event - The React SyntheticEvent object + * @param {object} data - All props and the event value. + */ + onInput?: (event: React.FormEvent, data: TextAreaProps) => void; /** Indicates row count for a TextArea. */ rows?: number | string; @@ -27,10 +35,6 @@ export interface TextAreaProps { value?: number | string; } -export interface TextAreaOnChangeData extends TextAreaProps { - value?: string; -} - declare class TextArea extends React.Component { focus: () => void; } diff --git a/src/addons/TextArea/TextArea.js b/src/addons/TextArea/TextArea.js index dc44886c14..f09ca1884c 100644 --- a/src/addons/TextArea/TextArea.js +++ b/src/addons/TextArea/TextArea.js @@ -33,6 +33,13 @@ class TextArea extends Component { */ onChange: PropTypes.func, + /** + * Called on input. + * @param {SyntheticEvent} event - The React SyntheticEvent object + * @param {object} data - All props and the event value. + */ + onInput: PropTypes.func, + /** Indicates row count for a TextArea. */ rows: PropTypes.oneOfType([ PropTypes.number, @@ -75,6 +82,12 @@ class TextArea extends Component { const value = _.get(e, 'target.value') _.invoke(this.props, 'onChange', e, { ...this.props, value }) + } + + handleInput = (e) => { + const value = _.get(e, 'target.value') + + _.invoke(this.props, 'onInput', e, { ...this.props, value }) this.updateHeight() } @@ -117,6 +130,7 @@ class TextArea extends Component { {...rest} innerRef={this.handleRef} onChange={this.handleChange} + onInput={this.handleInput} rows={rows} style={{ resize, ...style }} value={value} diff --git a/src/addons/TextArea/index.d.ts b/src/addons/TextArea/index.d.ts index 17d24f85e4..002d364b63 100644 --- a/src/addons/TextArea/index.d.ts +++ b/src/addons/TextArea/index.d.ts @@ -1 +1 @@ -export { default, TextAreaProps, TextAreaOnChangeData } from './TextArea'; +export { default, TextAreaProps } from './TextArea'; diff --git a/test/specs/addons/TextArea/TextArea-test.js b/test/specs/addons/TextArea/TextArea-test.js index e16b778b7b..8d620acf3f 100644 --- a/test/specs/addons/TextArea/TextArea-test.js +++ b/test/specs/addons/TextArea/TextArea-test.js @@ -142,6 +142,20 @@ describe('TextArea', () => { }) }) + describe('onInput', () => { + it('is called with (e, data) on input', () => { + const spy = sandbox.spy() + const e = { target: { value: 'name' } } + const props = { 'data-foo': 'bar', onInput: spy } + + wrapperShallow(