hunk.code_window: import AsyncSelect from '../../src/Async';
   import CreatableSelect from '../../src/Creatable';
   import { Note } from '../styled-components';
   import { colourOptions } from '../data';
   const filterColors = (inputValue: string) =>
     colourOptions.filter(i =>
       i.label.toLowerCase().includes(inputValue.toLowerCase())
     );
   const promiseOptions = inputValue =>
     new Promise(resolve => {
       setTimeout(() => {
         resolve(filterColors(inputValue));
  
hunk.labels: keep keep keep keep keep replace replace replace replace keep keep keep keep keep
hunk.after_edit: const filterColors = (inputValue: string) => {
     if (inputValue) {
       return colourOptions.filter(i =>
           i.label.toLowerCase().includes(inputValue.toLowerCase())
         );
     }
     return colourOptions;
   };
  
hunk.file_path: docs/examples/AccessingInternals.js
hunk.type: replace
file: // @flow
  
  import React from 'react';
  import Select from '../../src';
  import { colourOptions } from '../data';
  
  const indicatorSeparatorStyle = {
    alignSelf: 'stretch',
    backgroundColor: colourOptions[2].color,
    marginBottom: 8,
    marginTop: 8,
    width: 1,
  };
  
  const IndicatorSeparator = ({ innerProps }) => {
    return (
      <span style={indicatorSeparatorStyle} {...innerProps}/>
    );
  };
  
  export default () => (
    <Select
      closeMenuOnSelect={false}
      components={{ IndicatorSeparator }}
      defaultValue={[colourOptions[4], colourOptions[5]]}
      isMulti
      options={colourOptions}
    />
  );
  