fix(autocomplete): show the corresponding hint

Was not working because of template strings having linebreaks.

fixes #29

Author: vvo

src/formatAutocompleteSuggestion.js

@@ -8,10 +8,12 @@ export default function formatAutocompleteSuggestion({
   isCity,
   name
 }) {
-  return (
-`<span class="pl-icon">${icons[isCity === false ? 'address' : 'city']}</span>
+  const out = `<span class="pl-icon">${icons[isCity === false ? 'address' : 'city']}</span>
 <span class="pl-name">${name}</span> <span class="pl-address">
 ${isCity === false ? `${city},` : ``}
  ${administrative},
- ${country}</span>`);
+ ${country}</span>`
+  .replace(/\n/g, '');
+
+  return out;
 }

src/formatInputValue.js

@@ -5,9 +5,11 @@ export default function formatInputValue({
   isCity,
   name
 }) {
-  return (
-`${name}
+  const out = `${name}
 ${isCity === false ? ` ${city},` : ''}
  ${administrative},
- ${country}`);
+ ${country}`
+  .replace(/\n/g, '');
+
+  return out;
 }

src/places.scss

@@ -7,6 +7,8 @@ $greyish: #a4a4a4;
 .algolia-places {
   width: 100%; // we ask the autocomplete to take the full width of his container
 
+  .aa-hint {color: #dedede}
+
   .aa-input {
     border: solid 0.063em rgba(255, 255, 255, 0.5);
     box-shadow: 0 0.063em 0.625em rgba(0, 0, 0, 0.2), 0 0.125em 0.250em 0 rgba(0, 0, 0, 0.1);