1 

     2 import React from 'react';

     3 import PropTypes from 'prop-types';

     4 

     5 import { getAnnotationStyle } from '../utils';

     6 

     7 const AnnotationQuote = ({ annotation, metacategories }) => {

     8   let selector = false;

     9 

    10   if (annotation.target[0].selector) {

    11     selector = annotation.target[0].selector.find(s => s.type === 'TextQuoteSelector');

    12   }

    13 

    14   if (selector) {

    15     return (

    16       <div className="exact">

    17         <p>

    18           { selector.prefix }

    19           <span style={getAnnotationStyle(annotation, metacategories)}>{ selector.exact }</span>

    20           { selector.suffix }

    21         </p>

    22       </div>

    23     );

    24   }

    25   return null;

    26 };

    27 

    28 

    29 AnnotationQuote.propTypes = {

    30   annotation: PropTypes.object.isRequired,

    31   metacategories: PropTypes.arrayOf(PropTypes.object).isRequired,

    32 };

    33 

    34 export default AnnotationQuote;