{"action":"created","comment":{"url":"https://api.github.com/repos/coveo/search-ui/pulls/comments/202150230","pull_request_review_id":136786852,"id":202150230,"node_id":"MDI0OlB1bGxSZXF1ZXN0UmV2aWV3Q29tbWVudDIwMjE1MDIzMA==","diff_hunk":"@@ -197,45 +169,104 @@ export class SuggestionsManager {\n   public updateSuggestions(suggestions: Suggestion[]) {\n     $$(this.element).empty();\n     this.element.className = 'magic-box-suggestions';\n-    _.each(suggestions, (suggestion: Suggestion) => {\n-      var dom = suggestion.dom;\n-      if (!dom) {\n-        dom = document.createElement('div');\n-        dom.className = 'magic-box-suggestion';\n-        if (suggestion.html != null) {\n-          dom.innerHTML = suggestion.html;\n-        } else if (suggestion.text != null) {\n-          dom.appendChild(document.createTextNode(suggestion.text));\n-        } else if (suggestion.separator != null) {\n-          dom.className = 'magic-box-suggestion-seperator';\n-          var suggestionLabel = document.createElement('div');\n-          suggestionLabel.className = 'magic-box-suggestion-seperator-label';\n-          suggestionLabel.appendChild(document.createTextNode(suggestion.separator));\n-          dom.appendChild(suggestionLabel);\n-        }\n-        $$(dom).on('click', () => {\n-          suggestion.onSelect();\n-        });\n-        $$(dom).on('keyboardSelect', () => {\n-          suggestion.onSelect();\n-        });\n-        $$(dom).addClass(this.options.selectableClass);\n-      } else {\n-        // this need to be done if the selection is in cache and the dom is set in the suggestion\n-        $$(dom).removeClass(this.options.selectedClass);\n-        var found = $$(dom).find('.' + this.options.selectableClass);\n-        $$(found).removeClass(this.options.selectedClass);\n-      }\n+\n+    const suggestionsContainer = this.buildSuggestionsContainer();\n+    $$(this.element).append(suggestionsContainer.el);\n+\n+    each(suggestions, (suggestion: Suggestion) => {\n+      const dom = suggestion.dom ? this.modifyDomFromExistingSuggestion(suggestion.dom) : this.createDomFromSuggestion(suggestion);\n+\n+      dom.setAttribute('id', `magic-box-suggestion-${indexOf(suggestions, suggestion)}`);\n+      dom.setAttribute('role', 'option');\n+\n       dom['suggestion'] = suggestion;\n-      this.element.appendChild(dom);\n+      suggestionsContainer.append(dom.el);\n+    });\n+\n+    this.hasSuggestions = suggestions.length > 0;\n+\n+    $$(this.element).toggleClass('magic-box-hasSuggestion', this.hasSuggestions);\n+    $$(this.magicBoxContainer).setAttribute('aria-expanded', this.hasSuggestions.toString());\n+  }\n+\n+  private buildSuggestionsContainer() {\n+    return $$('div', {\n+      id: 'coveo-magicbox-suggestions',\n+      role: 'listbox'\n     });\n-    if (suggestions.length > 0) {\n-      $$(this.element).addClass('magic-box-hasSuggestion');\n-      this.hasSuggestions = true;\n+  }\n+\n+  private createDomFromSuggestion(suggestion: Suggestion) {\n+    const dom = $$('div', {\n+      className: `magic-box-suggestion ${this.options.selectableClass}`\n+    });\n+\n+    dom.on('click', () => {\n+      suggestion.onSelect();\n+    });\n+\n+    dom.on('keyboardSelect', () => {\n+      suggestion.onSelect();\n+    });\n+\n+    if (suggestion.html) {\n+      dom.el.innerHTML = suggestion.html;\n+      return dom;\n+    }\n+\n+    if (suggestion.text) {\n+      dom.text(suggestion.text);\n+      return dom;\n+    }\n+\n+    if (suggestion.separator) {\n+      dom.addClass('magic-box-suggestion-seperator');\n+      const suggestionLabel = $$(\n+        'div',\n+        {\n+          className: 'magic-box-suggestion-seperator-label'\n+        },\n+        suggestion.separator\n+      );\n+      dom.append(suggestionLabel.el);\n+      return dom;\n+    }\n+\n+    return dom;\n+  }\n+\n+  private modifyDomFromExistingSuggestion(dom: HTMLElement) {\n+    // this need to be done if the selection is in cache and the dom is set in the suggestion\n+    $$(dom).removeClass(this.options.selectedClass);\n+    const found = $$(dom).find('.' + this.options.selectableClass);\n+    $$(found).removeClass(this.options.selectedClass);\n+    return $$(dom);\n+  }\n+\n+  private move(direction: 'up' | 'down') {\n+    const currentlySelected = $$(this.element).find(`.${this.options.selectedClass}`);\n+    const selectables = $$(this.element).findAll(`.${this.options.selectableClass}`);\n+    const currentIndex = indexOf(selectables, currentlySelected);\n+\n+    let index = direction == 'up' ? currentIndex - 1 : currentIndex + 1;\n+    if (index < -1) {","path":"src/magicbox/SuggestionsManager.ts","position":238,"original_position":238,"commit_id":"98648ff9cefc02fb1e0e3537dbd011f07ecd89c2","original_commit_id":"98648ff9cefc02fb1e0e3537dbd011f07ecd89c2","user":{"login":"samisayegh","id":5565841,"node_id":"MDQ6VXNlcjU1NjU4NDE=","avatar_url":"https://avatars2.githubusercontent.com/u/5565841?v=4","gravatar_id":"","url":"https://api.github.com/users/samisayegh","html_url":"https://github.com/samisayegh","followers_url":"https://api.github.com/users/samisayegh/followers","following_url":"https://api.github.com/users/samisayegh/following{/other_user}","gists_url":"https://api.github.com/users/samisayegh/gists{/gist_id}","starred_url":"https://api.github.com/users/samisayegh/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/samisayegh/subscriptions","organizations_url":"https://api.github.com/users/samisayegh/orgs","repos_url":"https://api.github.com/users/samisayegh/repos","events_url":"https://api.github.com/users/samisayegh/events{/privacy}","received_events_url":"https://api.github.com/users/samisayegh/received_events","type":"User","site_admin":false},"body":"Should this condition be `< 0` instead? Seems in the case when we reach the end of the list, we reset to `0` on line 256.","created_at":"2018-07-12T19:20:06Z","updated_at":"2018-07-12T19:23:48Z","html_url":"https://github.com/coveo/search-ui/pull/867#discussion_r202150230","pull_request_url":"https://api.github.com/repos/coveo/search-ui/pulls/867","author_association":"COLLABORATOR","_links":{"self":{"href":"https://api.github.com/repos/coveo/search-ui/pulls/comments/202150230"},"html":{"href":"https://github.com/coveo/search-ui/pull/867#discussion_r202150230"},"pull_request":{"href":"https://api.github.com/repos/coveo/search-ui/pulls/867"}}},"pull_request":{"url":"https://api.github.com/repos/coveo/search-ui/pulls/867","id":200819998,"node_id":"MDExOlB1bGxSZXF1ZXN0MjAwODE5OTk4","html_url":"https://github.com/coveo/search-ui/pull/867","diff_url":"https://github.com/coveo/search-ui/pull/867.diff","patch_url":"https://github.com/coveo/search-ui/pull/867.patch","issue_url":"https://api.github.com/repos/coveo/search-ui/issues/867","number":867,"state":"open","locked":false,"title":"Accessibility properties (combobox / listbox) for the search box","user":{"login":"olamothe","id":1591893,"node_id":"MDQ6VXNlcjE1OTE4OTM=","avatar_url":"https://avatars1.githubusercontent.com/u/1591893?v=4","gravatar_id":"","url":"https://api.github.com/users/olamothe","html_url":"https://github.com/olamothe","followers_url":"https://api.github.com/users/olamothe/followers","following_url":"https://api.github.com/users/olamothe/following{/other_user}","gists_url":"https://api.github.com/users/olamothe/gists{/gist_id}","starred_url":"https://api.github.com/users/olamothe/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/olamothe/subscriptions","organizations_url":"https://api.github.com/users/olamothe/orgs","repos_url":"https://api.github.com/users/olamothe/repos","events_url":"https://api.github.com/users/olamothe/events{/privacy}","received_events_url":"https://api.github.com/users/olamothe/received_events","type":"User","site_admin":false},"body":"\r\n\r\n\r\n[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://dashboard.heroku.com/pipelines/a3535101-5bbf-4a5b-a909-47fcf8c9f149)","created_at":"2018-07-11T20:43:28Z","updated_at":"2018-07-12T19:23:48Z","closed_at":null,"merged_at":null,"merge_commit_sha":"fdca2d2ff3e75a9f1cc5fb559a44c1e4dc0c7c49","assignee":null,"assignees":[],"requested_reviewers":[{"login":"huppeje","id":39059543,"node_id":"MDQ6VXNlcjM5MDU5NTQz","avatar_url":"https://avatars0.githubusercontent.com/u/39059543?v=4","gravatar_id":"","url":"https://api.github.com/users/huppeje","html_url":"https://github.com/huppeje","followers_url":"https://api.github.com/users/huppeje/followers","following_url":"https://api.github.com/users/huppeje/following{/other_user}","gists_url":"https://api.github.com/users/huppeje/gists{/gist_id}","starred_url":"https://api.github.com/users/huppeje/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/huppeje/subscriptions","organizations_url":"https://api.github.com/users/huppeje/orgs","repos_url":"https://api.github.com/users/huppeje/repos","events_url":"https://api.github.com/users/huppeje/events{/privacy}","received_events_url":"https://api.github.com/users/huppeje/received_events","type":"User","site_admin":false}],"requested_teams":[],"labels":[],"milestone":null,"commits_url":"https://api.github.com/repos/coveo/search-ui/pulls/867/commits","review_comments_url":"https://api.github.com/repos/coveo/search-ui/pulls/867/comments","review_comment_url":"https://api.github.com/repos/coveo/search-ui/pulls/comments{/number}","comments_url":"https://api.github.com/repos/coveo/search-ui/issues/867/comments","statuses_url":"https://api.github.com/repos/coveo/search-ui/statuses/98648ff9cefc02fb1e0e3537dbd011f07ecd89c2","head":{"label":"coveo:JSUI-2166","ref":"JSUI-2166","sha":"98648ff9cefc02fb1e0e3537dbd011f07ecd89c2","user":{"login":"coveo","id":8632328,"node_id":"MDEyOk9yZ2FuaXphdGlvbjg2MzIzMjg=","avatar_url":"https://avatars2.githubusercontent.com/u/8632328?v=4","gravatar_id":"","url":"https://api.github.com/users/coveo","html_url":"https://github.com/coveo","followers_url":"https://api.github.com/users/coveo/followers","following_url":"https://api.github.com/users/coveo/following{/other_user}","gists_url":"https://api.github.com/users/coveo/gists{/gist_id}","starred_url":"https://api.github.com/users/coveo/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/coveo/subscriptions","organizations_url":"https://api.github.com/users/coveo/orgs","repos_url":"https://api.github.com/users/coveo/repos","events_url":"https://api.github.com/users/coveo/events{/privacy}","received_events_url":"https://api.github.com/users/coveo/received_events","type":"Organization","site_admin":false},"repo":{"id":58133471,"node_id":"MDEwOlJlcG9zaXRvcnk1ODEzMzQ3MQ==","name":"search-ui","full_name":"coveo/search-ui","owner":{"login":"coveo","id":8632328,"node_id":"MDEyOk9yZ2FuaXphdGlvbjg2MzIzMjg=","avatar_url":"https://avatars2.githubusercontent.com/u/8632328?v=4","gravatar_id":"","url":"https://api.github.com/users/coveo","html_url":"https://github.com/coveo","followers_url":"https://api.github.com/users/coveo/followers","following_url":"https://api.github.com/users/coveo/following{/other_user}","gists_url":"https://api.github.com/users/coveo/gists{/gist_id}","starred_url":"https://api.github.com/users/coveo/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/coveo/subscriptions","organizations_url":"https://api.github.com/users/coveo/orgs","repos_url":"https://api.github.com/users/coveo/repos","events_url":"https://api.github.com/users/coveo/events{/privacy}","received_events_url":"https://api.github.com/users/coveo/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/coveo/search-ui","description":"Coveo Search UI framework","fork":false,"url":"https://api.github.com/repos/coveo/search-ui","forks_url":"https://api.github.com/repos/coveo/search-ui/forks","keys_url":"https://api.github.com/repos/coveo/search-ui/keys{/key_id}","collaborators_url":"https://api.github.com/repos/coveo/search-ui/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/coveo/search-ui/teams","hooks_url":"https://api.github.com/repos/coveo/search-ui/hooks","issue_events_url":"https://api.github.com/repos/coveo/search-ui/issues/events{/number}","events_url":"https://api.github.com/repos/coveo/search-ui/events","assignees_url":"https://api.github.com/repos/coveo/search-ui/assignees{/user}","branches_url":"https://api.github.com/repos/coveo/search-ui/branches{/branch}","tags_url":"https://api.github.com/repos/coveo/search-ui/tags","blobs_url":"https://api.github.com/repos/coveo/search-ui/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/coveo/search-ui/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/coveo/search-ui/git/refs{/sha}","trees_url":"https://api.github.com/repos/coveo/search-ui/git/trees{/sha}","statuses_url":"https://api.github.com/repos/coveo/search-ui/statuses/{sha}","languages_url":"https://api.github.com/repos/coveo/search-ui/languages","stargazers_url":"https://api.github.com/repos/coveo/search-ui/stargazers","contributors_url":"https://api.github.com/repos/coveo/search-ui/contributors","subscribers_url":"https://api.github.com/repos/coveo/search-ui/subscribers","subscription_url":"https://api.github.com/repos/coveo/search-ui/subscription","commits_url":"https://api.github.com/repos/coveo/search-ui/commits{/sha}","git_commits_url":"https://api.github.com/repos/coveo/search-ui/git/commits{/sha}","comments_url":"https://api.github.com/repos/coveo/search-ui/comments{/number}","issue_comment_url":"https://api.github.com/repos/coveo/search-ui/issues/comments{/number}","contents_url":"https://api.github.com/repos/coveo/search-ui/contents/{+path}","compare_url":"https://api.github.com/repos/coveo/search-ui/compare/{base}...{head}","merges_url":"https://api.github.com/repos/coveo/search-ui/merges","archive_url":"https://api.github.com/repos/coveo/search-ui/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/coveo/search-ui/downloads","issues_url":"https://api.github.com/repos/coveo/search-ui/issues{/number}","pulls_url":"https://api.github.com/repos/coveo/search-ui/pulls{/number}","milestones_url":"https://api.github.com/repos/coveo/search-ui/milestones{/number}","notifications_url":"https://api.github.com/repos/coveo/search-ui/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/coveo/search-ui/labels{/name}","releases_url":"https://api.github.com/repos/coveo/search-ui/releases{/id}","deployments_url":"https://api.github.com/repos/coveo/search-ui/deployments","created_at":"2016-05-05T13:41:09Z","updated_at":"2018-07-11T21:09:17Z","pushed_at":"2018-07-12T13:52:15Z","git_url":"git://github.com/coveo/search-ui.git","ssh_url":"git@github.com:coveo/search-ui.git","clone_url":"https://github.com/coveo/search-ui.git","svn_url":"https://github.com/coveo/search-ui","homepage":null,"size":146323,"stargazers_count":49,"watchers_count":49,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":45,"mirror_url":null,"archived":false,"open_issues_count":4,"license":{"key":"apache-2.0","name":"Apache License 2.0","spdx_id":"Apache-2.0","url":"https://api.github.com/licenses/apache-2.0","node_id":"MDc6TGljZW5zZTI="},"forks":45,"open_issues":4,"watchers":49,"default_branch":"master"}},"base":{"label":"coveo:master","ref":"master","sha":"5441d0ae774261746a1ef6d6d7b6d6671f6c25b5","user":{"login":"coveo","id":8632328,"node_id":"MDEyOk9yZ2FuaXphdGlvbjg2MzIzMjg=","avatar_url":"https://avatars2.githubusercontent.com/u/8632328?v=4","gravatar_id":"","url":"https://api.github.com/users/coveo","html_url":"https://github.com/coveo","followers_url":"https://api.github.com/users/coveo/followers","following_url":"https://api.github.com/users/coveo/following{/other_user}","gists_url":"https://api.github.com/users/coveo/gists{/gist_id}","starred_url":"https://api.github.com/users/coveo/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/coveo/subscriptions","organizations_url":"https://api.github.com/users/coveo/orgs","repos_url":"https://api.github.com/users/coveo/repos","events_url":"https://api.github.com/users/coveo/events{/privacy}","received_events_url":"https://api.github.com/users/coveo/received_events","type":"Organization","site_admin":false},"repo":{"id":58133471,"node_id":"MDEwOlJlcG9zaXRvcnk1ODEzMzQ3MQ==","name":"search-ui","full_name":"coveo/search-ui","owner":{"login":"coveo","id":8632328,"node_id":"MDEyOk9yZ2FuaXphdGlvbjg2MzIzMjg=","avatar_url":"https://avatars2.githubusercontent.com/u/8632328?v=4","gravatar_id":"","url":"https://api.github.com/users/coveo","html_url":"https://github.com/coveo","followers_url":"https://api.github.com/users/coveo/followers","following_url":"https://api.github.com/users/coveo/following{/other_user}","gists_url":"https://api.github.com/users/coveo/gists{/gist_id}","starred_url":"https://api.github.com/users/coveo/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/coveo/subscriptions","organizations_url":"https://api.github.com/users/coveo/orgs","repos_url":"https://api.github.com/users/coveo/repos","events_url":"https://api.github.com/users/coveo/events{/privacy}","received_events_url":"https://api.github.com/users/coveo/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/coveo/search-ui","description":"Coveo Search UI framework","fork":false,"url":"https://api.github.com/repos/coveo/search-ui","forks_url":"https://api.github.com/repos/coveo/search-ui/forks","keys_url":"https://api.github.com/repos/coveo/search-ui/keys{/key_id}","collaborators_url":"https://api.github.com/repos/coveo/search-ui/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/coveo/search-ui/teams","hooks_url":"https://api.github.com/repos/coveo/search-ui/hooks","issue_events_url":"https://api.github.com/repos/coveo/search-ui/issues/events{/number}","events_url":"https://api.github.com/repos/coveo/search-ui/events","assignees_url":"https://api.github.com/repos/coveo/search-ui/assignees{/user}","branches_url":"https://api.github.com/repos/coveo/search-ui/branches{/branch}","tags_url":"https://api.github.com/repos/coveo/search-ui/tags","blobs_url":"https://api.github.com/repos/coveo/search-ui/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/coveo/search-ui/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/coveo/search-ui/git/refs{/sha}","trees_url":"https://api.github.com/repos/coveo/search-ui/git/trees{/sha}","statuses_url":"https://api.github.com/repos/coveo/search-ui/statuses/{sha}","languages_url":"https://api.github.com/repos/coveo/search-ui/languages","stargazers_url":"https://api.github.com/repos/coveo/search-ui/stargazers","contributors_url":"https://api.github.com/repos/coveo/search-ui/contributors","subscribers_url":"https://api.github.com/repos/coveo/search-ui/subscribers","subscription_url":"https://api.github.com/repos/coveo/search-ui/subscription","commits_url":"https://api.github.com/repos/coveo/search-ui/commits{/sha}","git_commits_url":"https://api.github.com/repos/coveo/search-ui/git/commits{/sha}","comments_url":"https://api.github.com/repos/coveo/search-ui/comments{/number}","issue_comment_url":"https://api.github.com/repos/coveo/search-ui/issues/comments{/number}","contents_url":"https://api.github.com/repos/coveo/search-ui/contents/{+path}","compare_url":"https://api.github.com/repos/coveo/search-ui/compare/{base}...{head}","merges_url":"https://api.github.com/repos/coveo/search-ui/merges","archive_url":"https://api.github.com/repos/coveo/search-ui/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/coveo/search-ui/downloads","issues_url":"https://api.github.com/repos/coveo/search-ui/issues{/number}","pulls_url":"https://api.github.com/repos/coveo/search-ui/pulls{/number}","milestones_url":"https://api.github.com/repos/coveo/search-ui/milestones{/number}","notifications_url":"https://api.github.com/repos/coveo/search-ui/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/coveo/search-ui/labels{/name}","releases_url":"https://api.github.com/repos/coveo/search-ui/releases{/id}","deployments_url":"https://api.github.com/repos/coveo/search-ui/deployments","created_at":"2016-05-05T13:41:09Z","updated_at":"2018-07-11T21:09:17Z","pushed_at":"2018-07-12T13:52:15Z","git_url":"git://github.com/coveo/search-ui.git","ssh_url":"git@github.com:coveo/search-ui.git","clone_url":"https://github.com/coveo/search-ui.git","svn_url":"https://github.com/coveo/search-ui","homepage":null,"size":146323,"stargazers_count":49,"watchers_count":49,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":true,"forks_count":45,"mirror_url":null,"archived":false,"open_issues_count":4,"license":{"key":"apache-2.0","name":"Apache License 2.0","spdx_id":"Apache-2.0","url":"https://api.github.com/licenses/apache-2.0","node_id":"MDc6TGljZW5zZTI="},"forks":45,"open_issues":4,"watchers":49,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/coveo/search-ui/pulls/867"},"html":{"href":"https://github.com/coveo/search-ui/pull/867"},"issue":{"href":"https://api.github.com/repos/coveo/search-ui/issues/867"},"comments":{"href":"https://api.github.com/repos/coveo/search-ui/issues/867/comments"},"review_comments":{"href":"https://api.github.com/repos/coveo/search-ui/pulls/867/comments"},"review_comment":{"href":"https://api.github.com/repos/coveo/search-ui/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/coveo/search-ui/pulls/867/commits"},"statuses":{"href":"https://api.github.com/repos/coveo/search-ui/statuses/98648ff9cefc02fb1e0e3537dbd011f07ecd89c2"}},"author_association":"MEMBER"}}
{"actor":{"display_login":"samisayegh"}}