ui: autocomplete: fix styles & ensure key type (#191)

packages/ui-default/components/autocomplete/autocomplete.page.styl

@@ -53,7 +53,7 @@
     white-space: nowrap
     text-overflow: ellipsis
 
-  &>svg
+  &>span.bp3-icon>svg
     font-size: 12px
     cursor: pointer
     padding: 4px
@@ -78,35 +78,19 @@
     &>div
       flex-grow: 1
 
-    &>svg
+    &>span.bp3-icon>svg
       color: transparent
 
     &[aria-selected='true']
       background-color: #fafafa
       font-weight: 600
 
-      svg
+      &>span.bp3-icon>svg
         color: #1890ff
 
     &[data-focus='true']
       background-color: #e6f7ff
       cursor: pointer
 
-      svg
+      &>span.bp3-icon>svg
         color: currentColor
-
-svg.autocomplete-icon
-    -webkit-user-select: none
-    -moz-user-select: none
-    -ms-user-select: none
-    user-select: none
-    width: 1em
-    height: 1em
-    display: inline-block
-    fill: currentColor
-    -webkit-flex-shrink: 0
-    -ms-flex-negative: 0
-    flex-shrink: 0
-    -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
-    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
-    font-size: 1.25rem

packages/ui-default/components/autocomplete/components/ProblemSelectAutoComplete.jsx

@@ -11,7 +11,7 @@ const ProblemSelectAutoComplete = forwardRef(function ProblemSelectAutoComplete(
       return (pdoc.pid ? `${pdoc.pid} ` : '') + pdoc.title;
   }; */
 
-  const itemKey = (pdoc) => pdoc.docId || pdoc;
+  const itemKey = (pdoc) => `${pdoc.docId || pdoc}`; // force string
 
   const renderItem = (pdoc) => (
     <div className="media">

packages/ui-default/components/autocomplete/index.jsx

@@ -20,6 +20,8 @@ export default class AutoComplete extends DOMAttachedObject {
     this.onChange = this.onChange.bind(this);
     this.container = document.createElement('div');
     this.$dom.addClass('autocomplete-dummy').after(this.container);
+    // Note: use `setTimeout(fn, 0)` to ensure that code is executed after browser autofill
+    // also see https://stackoverflow.com/a/779785/13553984
     setTimeout(() => this.attach(), 0);
   }