Escaping regex characters

[aai/sparky-fe.git] / src / generic-components / autoCompleteSearchBar / AutoCompleteSearchBar.jsx

diff --git a/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx b/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx
index b7fca67..47cdc9a 100644 (file)
--- a/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx
+++ b/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx
@@ -94,13 +94,13 @@ export default class AutoCompleteSearchBar extends Component {
 
   render() {
     const {
-            value, suggestions,
-            suggestionName, cachedSuggestions,
-            onInputChange, onInvalidSearch,
-            onClearSuggestionsTextFieldRequested,
-            onSuggestionsClearRequested,
-            dispatchAnalytics
-          } = this.props;
+      value, suggestions,
+      suggestionName, cachedSuggestions,
+      onInputChange, onInvalidSearch,
+      onClearSuggestionsTextFieldRequested,
+      onSuggestionsClearRequested,
+      dispatchAnalytics
+    } = this.props;
     const inputProps = {
       placeholder: SEARCH_PLACEHOLDER_TEXT,
       value,
@@ -164,7 +164,8 @@ export default class AutoCompleteSearchBar extends Component {
                     <Highlighter key={arrayIndex + 'high'}
                                  highlightClassName='highlight'
                                  searchWords={toHighLightArray}
-                                 textToHighlight={suggestionTextArray[arrayIndex]}/>
+                                 textToHighlight={suggestionTextArray[arrayIndex]}
+                                 autoEscape={true}/>
                     { ++arrayIndex ? ' ' : ' '}
                  </span>);
 
@@ -185,7 +186,8 @@ export default class AutoCompleteSearchBar extends Component {
                       <Highlighter key={arrayIndex + 'high'}
                                    highlightClassName='highlight'
                                    searchWords={toHighLightArray}
-                                   textToHighlight={suggestionTextArray[arrayIndex]}/>
+                                   textToHighlight={suggestionTextArray[arrayIndex]}
+                                   autoEscape={true}/>
                       { ++arrayIndex ? ' ' : ' '}
                    </span>);
 
@@ -201,7 +203,7 @@ export default class AutoCompleteSearchBar extends Component {
       rest.className = 'react-autosuggest__suggestions-containerCopy';
     }
     return (
-      <div {...rest}>
+      <div {...rest.containerProps} {...rest}>
         {children}
       </div>
     );