palantir/blueprint

Question: [Omnibar]: How do I get the keyboard controls to work when initialContent is displayed?

オープン

#3,160 opened on 2018/11/16

 (10 件のコメント) (0 件のリアクション) (0 人の担当者)TypeScript (2,167 件のフォーク)batch import
Package: selectType: enhancementhelp wanted

Repository metrics

Stars
 (20,263 個のスター)
PR merge metrics
 (平均マージ 43d 10h) (30d で 27 merged PRs)

説明

Environment

  • Package version(s): @blueprintjs/core - v3.7.0 & @blueprintjs/select v3.2.0
  • Browser and OS versions: Chrome v70 / macOS Sierra

Question

I'm using Omnibar in https://pasteapp.com.

My setup is as follows;

  1. I have a React Component Foo
  2. The component Foo is stateful
  3. The state is composed of items and filtered items
  4. The component renders Omnibar like this;
<Omnibar
  isOpen={this.props.isOpen}
  itemRenderer={this.renderItem}
  onQueryChange={this.handleQueryChange}
  items={this.state.filteredItems}
  onItemSelect={this.props.onItemSelect}
  onClose={this.props.onClose}
  inputProps={{
    leftIcon: null
  }}
/>

It works just fine, I can use keyboard controls (arrow keys) to go up/down in the results, however, as soon as I introduce initialContent like this;

<Omnibar
  ...
  initialContent={this.state.items.slice(0, 10).map(this.renderItem)}
/>

...the items are shown, but I can't use the keyboard controls anymore. No exceptions were thrown, or errors were logged.

What am I doing wrong here?

コントリビューターガイド