economist-components / component-navigation / 322

Pull #187

travis-ci

feat: hugely simplify the usage of the nav

Rather than using the complex and opaque props the nav now has one simple `menu` prop which takes
a React node (so any element you want), and is extensible with children.

BREAKING CHANGE:

This is a huge breaking change, it has been redeveloped from the ground up, but some changes are:

 - The `svgUri`, `sectionCardData`, `moreBalloonData`, `accordionData` and `sharedMenu` props are
   no longer present. Instead, generate your own HTML and put in `menu`. For example:

   ### Old
   ```
   import React from 'react';
   import Navigation from '@economist/component-navigation';
   export default (
     <Navigation
       className="myNav"
       svgUri="assets/icons.svg"
       sectionsCardData={navigationLinks}
       moreBalloonData={moreBalloonData}
       accordionData={accordionContext}
       sharedMenu={sharedMenu}
     />
   );
   ```

   ### New
   ```
   import React from 'react';
   import Navigation from '@economist/component-navigation';
   import { Accordion, Panel } from '@economist/component-accordion';
   import { Search } from '@economist/component-google-search';
   export default (
     <Navigation
       className="myNav"
       logo={<img src="assets/icons.svg#logo" />}
       menu={
         <Accordion>
           <Panel header="Topics">
             <ul><li>Latest Updates</li></ul>
             ...
           </Panel>
           <a>Latest Updates</a>
           <Panel header="More">
             <ul><li>Apps and Digital Editions</li></ul>
             ...
           </Panel>
         </Accordion>
       }
     >
       <button>Subscribe</button>
       <Accordion>
         <Panel header="Log In">
         </Panel>
       </Accordion>
       <Search/>
     </Navigation>
   );
   ```

 - All Economist specific CSS has been removed. The current CSS only provides simple styling
   for things like the height, wrapper width, and background color.

 - The logo is no longer provided for you, no... (continued)

3 of 3 new or added lines in 1 file covered. (100.0%)

6 of 6 relevant lines covered (100.0%)

14.67 hits per line