open-nomad/ui/app/templates/components/multi-select-dropdown.hbs
Buck Doyle 244157786a
Add explicit this to templates (#8388)
This is the result of running the no-implicit-this-codemod, some manual fixes,
and the addition of a linting rule to prevent future ambiguity.
2020-07-09 15:19:07 -05:00

43 lines
1.4 KiB
Handlebars

<BasicDropdown
@horizontalPosition="left"
@onOpen={{action (queue (action (mut this.isOpen) true) (action this.capture))}}
@onClose={{action (mut this.isOpen) false}} as |dd|
>
<dd.Trigger data-test-dropdown-trigger class="dropdown-trigger" {{on "keydown" (action "openOnArrowDown" dd)}}>
<div class="dropdown-trigger-label">
{{this.label}}
{{#if this.selection.length}}
<span data-test-dropdown-count class="tag is-light">
{{this.selection.length}}
</span>
{{/if}}
</div>
<span class="dropdown-trigger-icon ember-power-select-status-icon"></span>
</dd.Trigger>
<dd.Content class="dropdown-options">
<ul role="listbox" data-test-dropdown-options>
{{#each this.options key="key" as |option|}}
<li
data-test-dropdown-option={{option.key}}
class="dropdown-option"
tabindex="0"
onkeydown={{action "traverseList" option}}
>
<label>
<input
type="checkbox"
tabindex="-1"
checked={{contains option.key this.selection}}
onchange={{action "toggle" option}}
/>
{{option.label}}
</label>
</li>
{{else}}
<em data-test-dropdown-empty class="dropdown-empty">
No options
</em>
{{/each}}
</ul>
</dd.Content>
</BasicDropdown>