Skip to content

Commit 8368f56

Browse files
authored
fix(ReactTags): Remove resetInputOnDelete prop as it was an internal API and don't focus on text input after tag is deleted or clicked since it interefers with Accessibility (#679)
* remove greenkeeper badge
1 parent 703cf50 commit 8368f56

File tree

3 files changed

+5
-20
lines changed

3 files changed

+5
-20
lines changed

README.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ React-Tags
77
[![devDependency Status](https://david-dm.org/yahoo/react-dnd-touch-backend/dev-status.svg)](https://david-dm.org/yahoo/react-dnd-touch-backend#info=devDependencies)
88
[![npm downloads](https://img.shields.io/npm/dm/react-tag-input.svg?style=flat-square)](https://www.npmjs.com/package/react-tag-input)
99
[![build status](https://img.shields.io/travis/prakhar1989/react-tags.svg?style=flat-square)](https://travis-ci.org/prakhar1989/react-tags)
10-
[![Greenkeeper badge](https://badges.greenkeeper.io/prakhar1989/react-tags.svg)](https://greenkeeper.io/)
1110
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
1211
<a href="https://codeclimate.com/github/prakhar1989/react-tags/maintainability"><img src="https://api.codeclimate.com/v1/badges/b9edb2810b02bb845d20/maintainability" /></a>
1312
<a href="https://codeclimate.com/github/prakhar1989/react-tags/test_coverage"><img src="https://api.codeclimate.com/v1/badges/b9edb2810b02bb845d20/test_coverage" /></a>

__tests__/reactTags.test.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@ describe('Test ReactTags', () => {
4949
handleAddition: noop,
5050
allowDeleteFromEmptyInput: true,
5151
allowAdditionFromPaste: true,
52-
resetInputOnDelete: true,
5352
autocomplete: false,
5453
readOnly: false,
5554
allowDragDrop: true,
@@ -322,7 +321,7 @@ describe('Test ReactTags', () => {
322321
throw error;
323322
});
324323

325-
const $el = mount(mockItem({ readOnly: true, resetInputOnDelete: false }));
324+
const $el = mount(mockItem({ readOnly: true}));
326325
const $tag = $el.find('.ReactTags__tag');
327326
$tag.simulate('click');
328327
});

src/components/ReactTags.js

Lines changed: 4 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,6 @@ class ReactTags extends Component {
4545
allowDeleteFromEmptyInput: PropTypes.bool,
4646
allowAdditionFromPaste: PropTypes.bool,
4747
allowDragDrop: PropTypes.bool,
48-
resetInputOnDelete: PropTypes.bool,
4948
handleInputChange: PropTypes.func,
5049
handleInputFocus: PropTypes.func,
5150
handleInputBlur: PropTypes.func,
@@ -81,7 +80,6 @@ class ReactTags extends Component {
8180
handleAddition: noop,
8281
allowDeleteFromEmptyInput: true,
8382
allowAdditionFromPaste: true,
84-
resetInputOnDelete: true,
8583
autocomplete: false,
8684
readOnly: false,
8785
allowUnique: true,
@@ -114,7 +112,6 @@ class ReactTags extends Component {
114112
this.handleChange = this.handleChange.bind(this);
115113
this.moveTag = this.moveTag.bind(this);
116114
this.handlePaste = this.handlePaste.bind(this);
117-
this.resetAndFocusInput = this.resetAndFocusInput.bind(this);
118115
this.handleSuggestionHover = this.handleSuggestionHover.bind(this);
119116
this.handleSuggestionClick = this.handleSuggestionClick.bind(this);
120117
}
@@ -153,33 +150,23 @@ class ReactTags extends Component {
153150
.indexOf(query.toLowerCase());
154151
};
155152

156-
resetAndFocusInput() {
153+
resetAndFocusInput = () => {
157154
this.setState({ query: '' });
158155
if (this.textInput) {
159156
this.textInput.value = '';
160157
this.textInput.focus();
161158
}
162159
}
163160

164-
handleDelete(i, e) {
165-
this.props.handleDelete(i, e);
166-
if (!this.props.resetInputOnDelete) {
167-
this.textInput && this.textInput.focus();
168-
} else {
169-
this.resetAndFocusInput();
170-
}
171-
e.stopPropagation();
161+
handleDelete(index, event) {
162+
this.props.handleDelete(index, event);
163+
event.stopPropagation();
172164
}
173165

174166
handleTagClick(i, e) {
175167
if (this.props.handleTagClick) {
176168
this.props.handleTagClick(i, e);
177169
}
178-
if (!this.props.resetInputOnDelete) {
179-
this.textInput && this.textInput.focus();
180-
} else {
181-
this.resetAndFocusInput();
182-
}
183170
}
184171

185172
handleChange(e) {

0 commit comments

Comments
 (0)