import * as React from 'react' ; export interface PersonType { first : string ; middle : string ; last : string ; } export const Person = ( { first , middle , last } ) => < div className = "person" > < p className = "title" > { last . toUpperCase ( ) } < /p> < p className = "subtitle" > { first } { middle } < /p> < /div>; ( Person as any ) . displayName = 'Person' ; const PersonSummary = ( { first , middle , last } ) => < li > { last } , { first } { middle } < /li>; export const Persons = ( { persons } ) => < ul > { persons . map ( ( p , i ) => < PersonSummary key = { i } { ... p } / > ) } < /ul>;