Update combo box components to React 16.3 lifecycle

[chandlerprall]

Part of #763

EuiComboBoxOptionsList and EuiComboBoxInput were straight-foward changes. I moved two class members on EuiComboBox into its state. Updating matchingOptions state value in componentDidUpdate could create an infinite loop so I added a quick check to see if the matching options have changed. Existing tests pass and the examples work identically to the published docs.

[nreese]

The clear button in the Single selection example does not work.

[chandlerprall]

@nreese good catch. Looks like combo box had an existing bug where the clear button was always displayed unless it was disabled. I've pushed up a fix to not show the clear button if

1. its disabled (existing functionality)
2. there is no onClear prop
3. there are no selected items

[nreese]

@chandlerprall I do not think "Looks like combo box had an existing bug where the clear button was always displayed unless it was disabled" is a bug. That is the intended behavior. The clear button should be displayed by default - unless it is disabled.

[snide]

Clear logic should be

isClearable=true, disabled={false}, and items.length > 0

We should not UI that doesn't provide an action. Better to have it appear when it has a use. Don't think we need the affordance in this case.

[chandlerprall]

Just saw I'd failed to push the additional change so it was quite difficult for anyone to see. It's at combo_box_input.js:152. The clear icon is displayed when clear prop is present, even if clear.onClick is undefined.

The issue @nreese discovered with single selection is because it sets isClearable={false} which comes into this function as an undefined onClear, and similarly having no selected options prevents onClick from getting a value.

The change shifts the UI button's display logic to match what @snide said in the above comment.

[nreese]

This is a lot cleaner - nice

[nreese]

lgtm

[snide]

Run locally and tested for functionality. Looks good.