diff --git a/README.md b/README.md index 78d58382..2d5ba5d6 100644 --- a/README.md +++ b/README.md @@ -299,10 +299,11 @@ The `texts` object requires the following structure: ```js { - placeholder, // optional: The text to display as placeholder on the search box. Defaults to `Choose...` - noMatches, // optional: The text to display when the search does not find results in the content list. Defaults to `No matches found` - label, // optional: Adds `aria-labelledby` to search input when input starts with `#`, adds `aria-label` to search input when label has value (not containing '#') - labelRemove, // optional: The text to display for `aria-label` on tag delete buttons which is combined with `aria-labelledby` pointing to the node label. Defaults to `Remove` + placeholder, // optional: The text to display as placeholder on the search box. Defaults to `Choose...` + inlineSearchPlaceholder, // optional: The text to display as placeholder on the inline search box. Only applicable with the `inlineSearchInput` setting. Defaults to `Search...` + noMatches, // optional: The text to display when the search does not find results in the content list. Defaults to `No matches found` + label, // optional: Adds `aria-labelledby` to search input when input starts with `#`, adds `aria-label` to search input when label has value (not containing '#') + labelRemove, // optional: The text to display for `aria-label` on tag delete buttons which is combined with `aria-labelledby` pointing to the node label. Defaults to `Remove` } ``` @@ -592,6 +593,7 @@ Released 2017 by [Hrusikesh Panda](https://github.com/mrchief) @ [Dow Jones](htt Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)): + | [toofff
toofff](http://www.yanoucrea.fr)
[πŸ›](https://github.com/dowjones/react-dropdown-tree-select/issues?q=author%3Atoofff "Bug reports") [πŸ’»](https://github.com/dowjones/react-dropdown-tree-select/commits?author=toofff "Code") [πŸ“–](https://github.com/dowjones/react-dropdown-tree-select/commits?author=toofff "Documentation") [πŸ€”](#ideas-toofff "Ideas, Planning, & Feedback") | [GrΓ©gory Copin
GrΓ©gory Copin](http://www.les-tilleuls.coop)
[πŸ›](https://github.com/dowjones/react-dropdown-tree-select/issues?q=author%3AGregcop1 "Bug reports") [πŸ’»](https://github.com/dowjones/react-dropdown-tree-select/commits?author=Gregcop1 "Code") | [PRIYANSHU AGRAWAL
PRIYANSHU AGRAWAL](https://github.com/priyanshu92)
[πŸ›](https://github.com/dowjones/react-dropdown-tree-select/issues?q=author%3Apriyanshu92 "Bug reports") [πŸ’»](https://github.com/dowjones/react-dropdown-tree-select/commits?author=priyanshu92 "Code") [πŸ€”](#ideas-priyanshu92 "Ideas, Planning, & Feedback") | [James Greenaway
James Greenaway](http://james.greenaway.io)
[πŸ›](https://github.com/dowjones/react-dropdown-tree-select/issues?q=author%3Ajvgreenaway "Bug reports") [πŸ’»](https://github.com/dowjones/react-dropdown-tree-select/commits?author=jvgreenaway "Code") [πŸ€”](#ideas-jvgreenaway "Ideas, Planning, & Feedback") | [itrombitas
itrombitas](https://github.com/itrombitas)
[πŸ’»](https://github.com/dowjones/react-dropdown-tree-select/commits?author=itrombitas "Code") | [Dave Henton
Dave Henton](https://github.com/davehenton)
[πŸš‡](#infra-davehenton "Infrastructure (Hosting, Build-Tools, etc)") | [Swetha Kolli
Swetha Kolli](https://github.com/nagaskolli)
[πŸ’»](https://github.com/dowjones/react-dropdown-tree-select/commits?author=nagaskolli "Code") | | :---: | :---: | :---: | :---: | :---: | :---: | :---: | diff --git a/__snapshots__/src/index.test.js.md b/__snapshots__/src/index.test.js.md index 182f516c..abf14839 100644 --- a/__snapshots__/src/index.test.js.md +++ b/__snapshots__/src/index.test.js.md @@ -30,6 +30,7 @@ Generated by [AVA](https://ava.li). > Snapshot 1 + + + ## renders input > Snapshot 1 diff --git a/__snapshots__/src/input/index.test.js.snap b/__snapshots__/src/input/index.test.js.snap index 81941268..236e815e 100644 Binary files a/__snapshots__/src/input/index.test.js.snap and b/__snapshots__/src/input/index.test.js.snap differ diff --git a/docs/src/stories/Options/index.js b/docs/src/stories/Options/index.js index b6536767..b4ce145c 100644 --- a/docs/src/stories/Options/index.js +++ b/docs/src/stories/Options/index.js @@ -20,6 +20,8 @@ class WithOptions extends PureComponent { disabled: false, readOnly: false, hierarchical: false, + placeholder: 'Choose...', + inlineSearchPlaceholder: 'Search...', } } @@ -48,6 +50,8 @@ class WithOptions extends PureComponent { readOnly, showDropdown, inlineSearchInput, + placeholder, + inlineSearchPlaceholder, } = this.state return ( @@ -83,6 +87,24 @@ class WithOptions extends PureComponent { +
+ + this.setState({ placeholder: e.target.value })} + /> +
+
+ + this.setState({ inlineSearchPlaceholder: e.target.value })} + /> +
diff --git a/src/index.js b/src/index.js index 4081b403..5871bac2 100644 --- a/src/index.js +++ b/src/index.js @@ -29,6 +29,7 @@ class DropdownTreeSelect extends Component { keepOpenOnSelect: PropTypes.bool, texts: PropTypes.shape({ placeholder: PropTypes.string, + inlineSearchPlaceholder: PropTypes.string, noMatches: PropTypes.string, label: PropTypes.string, labelRemove: PropTypes.string, @@ -306,6 +307,7 @@ class DropdownTreeSelect extends Component { onBlur={this.onInputBlur} onKeyDown={this.onKeyboardKeyDown} {...commonProps} + inlineSearchInput={inlineSearchInput} /> ) return ( diff --git a/src/input/index.js b/src/input/index.js index e331f946..99665365 100644 --- a/src/input/index.js +++ b/src/input/index.js @@ -30,7 +30,17 @@ class Input extends PureComponent { } render() { - const { inputRef, texts = {}, onFocus, onBlur, disabled, readOnly, onKeyDown, activeDescendant } = this.props + const { + inputRef, + texts = {}, + onFocus, + onBlur, + disabled, + readOnly, + onKeyDown, + activeDescendant, + inlineSearchInput, + } = this.props return ( { t.snapshot(wrapper) }) +test('renders inline search placeholder', t => { + const placeholderText = 'Search something' + const wrapper = toJson( + shallow() + ) + t.snapshot(wrapper) +}) + test('raises onchange', t => { const onChange = spy() const wrapper = shallow()