Feature/google search box #177
Conversation
…esource/atomic-react-components into feature/search-box-with-speech-capability
…esource/atomic-react-components into feature/search-box-with-speech-capability
…components into feature/google-search-box
| import type { Props } from './types'; | ||
|
|
||
| const Search = ({ className, inputProps, dataLists, renderListItem }: Props): Node => { | ||
| const [inputValue, setInputValue] = useState(inputProps.value || ''); |
There was a problem hiding this comment.
inputValue --> searchString looks more contextual
| searchText => { | ||
| const searchValue = typeof searchText === 'string' ? searchText : inputValue; | ||
|
|
||
| if (searchValue) { |
There was a problem hiding this comment.
this logic I believe would come from TypeAhead
| [inputValue, dataLists, setSearchList] | ||
| ); | ||
|
|
||
| const onResult = result => { |
There was a problem hiding this comment.
Can we make onResult more explicit? its ambiguous what it does
onSpeachRecognitionResults makes it more clear
| handleSpeechEnd, | ||
| }); | ||
|
|
||
| const onSpeechClick = () => onListen(); |
There was a problem hiding this comment.
onListen . --> onSpeechListenHandler
| <div className="search-button"> | ||
| <Button> | ||
| {isListening ? ( | ||
| <i className="search-icon search-loader" /> |
| <div className="search-box"> | ||
| <Input | ||
| {...inputProps} | ||
| aria-label="Search" |
There was a problem hiding this comment.
Labels should never be hard coded.
There was a problem hiding this comment.
yes, I'll update
| overflow: hidden; | ||
| } | ||
|
|
||
| button { |
There was a problem hiding this comment.
This is wrong don't style the component here
There was a problem hiding this comment.
Once Icon componet will be exposed then unnecessary codes will be removed.
| } | ||
|
|
||
| .search-mic { | ||
| background: url(images/googlemic.png) 0 0/24px no-repeat; |
There was a problem hiding this comment.
this is not a good approach
There was a problem hiding this comment.
It's a part of the icon component. Once Icon component will be exposed then these codes will be removed.
…components into feature/google-search-box
…components into feature/google-search-box
Working on all test cases.