## Select
The *select* component allows the user to select string values from a list and supports form output.

### Usage
The *select* component can be thought of as having two parts:
- the "trigger" portion of the component which shows in single select mode, basically a button which displays the current value and can toggle the menu.
- the "menu" portion which consists of a *listbox* which displays the list of available options.  Use *listbox items* to define the selectable children of a select component. 

By default, the trigger portion of the component only shows up in single selection mode as the behavior in multi-select mode is to only show the list and to always keep it open. Developers can create alternate behaviors by controlling the isMenuOpen prop and providing a custom trigger to the component.

As the user makes selection changes in the *select* component the output of the component can be used in two ways:
- If the *select* component is part of a form the results will be submitted along with the form. This is because the *select* component maintains a hidden native HTML select element in the dom and updates the "value" attribute of the native component as selection changes.
- Developers can hook up to the *select*'s onValueChange callback.

A displayString is generated by the component based on selection.  It should be a user-friendly version of the "value" string and gets displayed in the display portion of the component and is also included as a parameter in the onValueChange callback. If there are no selected items, the placeholder prop is used instead. If custom formatting is desired developers can provide an alternate displayStringFormatter function in the component's props.

The *select* component uses it's onClick and onKeydown events.  Authors can apply custom handlers to them and will be passed the event before select handles them.  An event that has had preventDefault called on it will be ignored by the select.  Select calls preventDefault on these events after it has handled them.

The position of the flyout can be controlled by setting the menuFlyoutConfig prop which applies *viewportPositioner* capabilities to the flyout menu.  The "anchor" for the *viewportPositioner* is the select trigger element.

### Accessibility
*Select* implements the recommended keyboard navigation scheme described [here](https://www.w3.org/TR/wai-aria-practices-1.1/#Listbox) for interacting with the listbox.  Additionally, in single select mode the button that toggles the list exposes "aria-haspopup" and "aria-expanded" attributes.