複数選択のオートコンプリートパターンで「すべて選択」を表示する方法
既存のデザイン：
シナリオ：
デフォルトの状態では、リスト全体をユーザーに表示しません。ユーザーが入力を開始すると、予測一致が表示されます
要素にはチェックボックスパターンを使用しません。ユーザーが提案されたアイテムをクリックすると、ツールチップを使用してこれが表示されます。
問題：
- 「すべて選択」オプションを表示する方法
- ユーザーがすべてを選択したら、ドロップダウンフィールド+入力エリアでもすべてのアイテムを選択する方法を選択しますか？
基本的に、これはこれに「すべて選択」オプションを追加することのすべてです https://ej2.syncfusion.com/demos/?_ga=2.256054221.719160238.1590220025-1863879226.1587444869#/material/multi-select/default.html
スクリーンショット：
この質問の重複の可能性が1つあります。しかし、これは私の質問に完全に答えるものではありません。提案された回答は、select allを押したときに入力ボックスに何を表示するかには答えません。
私たちはこのまったく同じ問題に直面しました。
私たちの複数選択コントロールは、1つの詳細を除いて、あなたのコントロールと同じように動作します。ユーザーがフィールドをクリックすると、メニューにはすぐに使用可能なオプションの完全なリストが表示されます。
いくつかの設計オプションを検討しましたが、「select all」コマンドをトリガーするには、わかりやすく、発見しやすいアフォーダンスが必要であることを早い段階で合意しました。
何度か繰り返した後、次のように、フィールドの真上にクリック可能なリンク（UIに適切なリンクスタイルを適用）を追加しました。
よりエレガントな方法があるかもしれませんが、これはうまく機能し、簡単に見つけることができ、そのラベルは明確です。
ただし、特にフィールドに多数のオプションを含めることができる場合は、すべてのオプションを選択解除するためのメソッドも提供するようにしてください。 "x"クリアボタンをフィールド内の右側に配置することは、これを行うためのシンプルで確立されたパターンです。
すべてのオプションを選択すると、リンクは無効なスタイルで表示されます。また、選択された各項目はメニューに表示されません。したがって、完全に空のメニューと無効な「すべて選択」リンクの組み合わせは、フィールドにサポートされているすべてのオプションが含まれていることを明確に反映しています。
より一般的な注意として、これが実際には適切なコントロールであることをテストで再確認することをお勧めします。
特にフィールド内に多数の「トークン」を表示する場合は、その内容を視覚的に把握することが困難な場合があり、リストコントロールの方が適している場合があります。これは、各アイテムに1行を割り当てることと、すべてのアイテムを左揃えにすることにより、テキストトークン/ピルよりもスキャンがはるかに簡単になるためです。
補遺（2020-05-24）
これを React Select で構築します。そのサイトでのコンポーネントの外観は少し異なりますが、[すべて選択]リンクを除いて、動作は同じです。そのため、そのページのサンプルをいじってみると、このコントロールが特定のデザインに適しているかどうかを簡単に確認できます。
特に、コンポーネントは、入力フィールドに表示されるトークンの数に応じて、垂直方向に拡大および縮小します。私たちのデザインコンテキストでは、この動作は数十のオプションが選択されていても（十分）うまくいきました。
ところで、フィールドラベルnextをフィールドに配置する場合は、フィールドと上揃えになるようにしてください。代わりに、ラベルがフィールドの垂直方向の中央に配置されていて、見つけるのが非常に難しい実装を見てきました。さらに、上に示すように、フィールドの上にラベルを配置します。
ユーザーが何も選択しなかった場合、ドロップダウンからすべてを意図していると考えられませんか？多くのサイトフィルターは同じ方法で機能します。ユーザーは既にフィルターを使用するためのトレーニングを受けています。既存のスキームを使用して、認知負荷を軽減します。
それでもユーザーに考えさせたい場合は、
「すべて選択」オプションを表示する方法
すべてのオプションの上部にある「すべて選択」オプションを維持するようにしてください
ユーザーがすべてを選択すると、すべてのアイテムを伝達する方法がドロップダウンフィールドで選択されます
オプションを選択すると、オプションリストの下に表示されなくなります。これは、指定したリンクのデフォルトの機能であるため、すべてのオプションを選択すると、オプションリストのすべてのエントリが削除されます。
「バドミントン」を選択すると、そのオプションは削除されます。 
入力エリアでも？
彼らのデフォルトモードに従って。選択した個々のオプションを削除するためのチップを取得し、ドロップダウンを使用しない場合は空きスペースに縮小します。
追加または編集時：
折りたたみ：
