hunk.code_window: }
   export function classNames(
     prefix?: string,
     cssKey?: string | null,
     state?: ClassNamesState,
     className?: string,
   ) {
  
hunk.labels: keep keep keep replace keep keep keep keep
hunk.after_edit:   prefix?: string | null,
  
hunk.file_path: src/utils.js
hunk.type: replace
file: import React, { Component } from 'react';
  import Tooltip from '@atlaskit/tooltip';
  import Select, { components } from '../../src';
  import { colourOptions } from '../data';
  const msgStyles = {
    background: colourOptions[2].color,
    color: 'white'
  };
  
  const NoOptionsMessage = (props) => {
    return (
      <Tooltip content="Custom NoOptionsMessage Component">
        <components.NoOptionsMessage {...props} />
      </Tooltip>
    );
  };
  
  type State = {};
  
  export default class CustomNoOptionsMessage extends Component<*, State> {
    state = {};
    render() {
      return (
        <Select
          isClearable
          components={{ NoOptionsMessage }}
          styles={{ noOptionsMessage: (base) => ({ ...base, ...msgStyles }) }}
          isSearchable
          name="color"
          options={[]}
        />
      );
    }
  }
  