Now the Select2 instance is correctly recognized as a combobox, and
the selected option is read aloud when it is focused, just like in
a standard select box.
This works by generating semi-random ids that are used for the
ARIA attributes. These are not intended to be consistent by any
means, they are just generated to make the instance accessible by
screen readers.
When the main container is focused, you can now move the highlighted
result by using the up and down arrows on the keyboard.
This does not yet keep the highlighted result visible at all times,
and it only is implemented on single selects, but that will come in
the future.
This makes quite a few changes, one of the major ones being the
removal of classes for marking options as selected or selectable,
and instead using the ARIA attributes which should already be
present.
Placeholder support has been implemented as a separate module, so
any selection container should be able to be decorated and get
instant placeholder support. It hooks into the updating method of
selections, and determines when to display the placeholder based
on the options that are being updated.
It works in the same way as the old placeholders. If no options
are selected and being displayed, like in the case of a multiple
select, then the placeholder will always be shown. If one option
is being displayed, and the id of the placeholder matches the id
of the selected element, then the placeholder will be shown. This
is similar to the functionality that was present in Select2 2.x,
where the placeholder could be passed in as an object that would
be compared to the selection.
This still requires that, for single selects, the first element
must match the placeholder id. Because the default placeholder id
is a blank string, this will maintain backwards compatibility with
past versions where the first option should be blank. This can
still be overridden to point at a different id, keeping support
for systems where the placeholder doesn't use a blank value.
**Note:** This does not hide the blank option for single selects,
but that will still be maintained for backwards compatibility
within the results module. It will not depend on a placeholder
being present, but instead will hide any options with blank text.
This adds a module for the old matcher, so users can decorate a
data adapter with the module to get the old matcher functionality.
The third parameter to the old matcher, the full element, will
always be the full object now. This does not match the old
functionality, where the third parameter for a `<select>` element
would be the `<option>` element.
We have to enforce ids being strings as the values of options within
a select will always be an id. This fixes an issue that we had with
array selections not being highlighted in the results.
People have asked about getting the multiple selection container
to show for a single selection. This is a basic example that shows
that it could easily be done now.
This adds decorator support in a very basic way, but enough that
it doesn't take a lot of effort to get it implemented.
This also starts work on splitting things out for theming.