QuickSearch
スペース区切り全順列でインクリメンタル検索できるScrapboxの部品
https://gyazo.com/d9e2d477b2530c43cd466e9cc6ca8da1
曖昧検索もできるので、正確に覚えてなくても探せる
https://gyazo.com/da3297370ca69753b0313f26aeac59ca
実装
3つの検索を組み合わせている
taberarelooのような正規表現による歯抜けマッチング
asearchによる曖昧検索
array-permutation-simpleでスペース区切りでの全順列マッチング
その辞書はリアルタイムに、他人がページ作成した等のイベントにあわせて更新している
/shokai/WebWorkerをproductionで使ってる話に詳しく書いた
UIはただaタグを積み上げているだけ
ブラウザは、一度aタグをfocusすれば、上下キーを押すだけで隣のaタグにfocusを移動してくれる
WAI-ARIAのrole属性のおかげかもしれない
enterキーを押したらリンク先に移動してくれる
全部ブラウザがやってくれる
https://gyazo.com/c8302665462c9bd45e01796316e84d2f
text inputから先頭のaタグに移動する部分だけ、自分で実装すれば良い
keydownイベントを見て、下キーを押したら先頭のaタグにfocus()する
リンク記法の補完も、ほぼ共通の検索を使っている
UIは別だが