We use Ember Power Select under the hood to deliver the best select experience. Please refer to their documentation for further customization.

In the example below, we have a label, hint, error validation, search and allowClear.


Single Select.

Select your country of residence

You selected, ""

  @hint="Select your country of residence"
  as |country|

<p class="mt-4">
  You selected, "{{}}"

Multiple Select

Edit this demo

In example you can select multiple options. To enable multiple select, just pass @isMultiple={{true}} to the component.

Select all countries you have lived

You selected, ""

  @hint="Select all countries you have lived"
  as |country|

<p class="mt-4">
  You selected, "{{this.selectedCountries}}"



Element: HTMLDivElement


Name Type Default Description
onChange * function -
options * enum -
selected * any -
beforeOptionsComponent string -
buildSelection function -
closeOnSelect boolean -
containerClass string - CSS classes to be added in the container element
defaultHighlighted any -
errors enum - A list of errors or a single text describing the error
groupComponent string -
hasError boolean - If has errors
hasSubmitted boolean - If the form has been submitted, used to force displaying errors
highlightOnHover boolean -
hint string - A help text to be displayed
initiallyOpened boolean -
isMultiple boolean - If is multiple select instead of single
label string - The input field label
matcher function -
matchTriggerWidth boolean -
noMatchesMessage string -
noMatchesMessageComponent string -
onBlur function -
onClose function -
onFocus function -
onFocusIn function -
onFocusOut function -
onInput function -
onKeydown function -
onOpen function -
optionsComponent string -
placeholderComponent string -
registerAPI function -
scrollTo function -
search function -
searchEnabled boolean -
searchField string -
searchMessage string -
searchMessageComponent string -
showError boolean - Force displaying errors
size enum - The size
tabindex enum -
triggerComponent string -
typeAheadOptionMatcher function -


Name Type Default Description
default * Array -
Released under MIT License - Created by Josemar Luedke