Summary

Currently, there is no way to define a placeholder for the EuiSuperSelect component. If you pass in a placeholder value it gets placed in the rest param. Then, the value of rest is spread onto the EuiSuperSelectControl.

Fix

Add a named prop to EuiSuperSelect for the placeholder. If there is no selected value on the component and a placeholder is provided put the placeholder text inside the button with the subdued text color.

Replace lines 156-166 of super_select_control.tsx

 <button
    type="button"
    className={classes}
    aria-haspopup="listbox"
    disabled={disabled || readOnly}
    // @ts-ignore Using as a selector only for mixin use
    readOnly={readOnly}
    {...rest}
>
    {(!selectedValue && placeholder) && <Text color="subdued">{placeholder}</Text>} // whatever size prop you need to use
    {selectedValue}
</button>