hunk.code_window: };
   export const defaultProps = {
     backspaceRemovesValue: true,
     blurInputOnSelect: isTouchCapable(),
     captureMenuScroll: !isTouchCapable(),
     closeMenuOnSelect: true,
     closeMenuOnScroll: false,
  
hunk.labels: keep keep add keep keep keep keep keep
hunk.after_edit:   'aria-live': 'polite',
  
hunk.file_path: packages/react-select/src/Select.js
hunk.type: add
file: // @flow
  
  import React from 'react';
  import Tooltip from '@atlaskit/tooltip';
  import Select, { components } from 'react-select';
  import { colourOptions } from '../data';
  
  const MultiValueContainer = props => {
    return (
      <Tooltip content={'Customise your multi-value container!'}>
        <components.MultiValueContainer {...props} />
      </Tooltip>
    );
  };
  
  export default () => (
    <Select
      closeMenuOnSelect={false}
      components={{ MultiValueContainer }}
      styles={{
        multiValue: base => ({
          ...base,
          border: `2px dotted ${colourOptions[2].color}`,
        }),
      }}
      defaultValue={[colourOptions[4], colourOptions[5]]}
      isMulti
      options={colourOptions}
    />
  );
  