update to React 16 (#28)

* update dependencies and unit tests to work with React 16
* fix broken links in docs
* add enhanced type definitions for single and multiple translation data

Author: Ryan Johnson

docs/api/action-creators.md

@@ -16,8 +16,8 @@ name | Type | Default | Description
 defaultLanguage | string | languages[0] | The language code for the language you'd like to set as the defualt.
 renderInnerHtml | boolean  | true |  Controls whether HTML in your translations will be rendered or returned as a plain string. 
 showMissingTranslationMsg | boolean | true | Controls whether missing translation message will be rendered when translation is undefined.
-missingTranslationCallback | function | undefined | A function that will be called when attempting to get an undefined translation. See [Handle missing translations](../features/#handle-missing-translations) for details.
-translationTransform | function | undefined | A transformation function that will be applied to translation data. See [Custom data format](../formatting-translation-data#custom-data-format) for details.
+missingTranslationCallback | function | undefined | A function that will be called when attempting to get an undefined translation. See [Handle missing translations](/features/#handle-missing-translations) for details.
+translationTransform | function | undefined | A transformation function that will be applied to translation data. See [Custom data format](/formatting-translation-data#custom-data-format) for details.
 
 <div class="admonition important">
   <p class="first admonition-title">Important</p>
@@ -73,13 +73,13 @@ store.dispatch(setLanguages(languages, 'fr'));
 
 ## addTranslation(data)
 
-Dispatch this action to add translation data for multiple languages from a json file, or vanilla JS to your redux store. Please see [formatting transaltion data](../formatting-translation-data#multiple-language-format) to ensure your data is in the proper format. 
+Dispatch this action to add translation data for multiple languages from a json file, or vanilla JS to your redux store. Please see [formatting transaltion data](/formatting-translation-data#multiple-language-format) to ensure your data is in the proper format. 
 
 ** Arguments **
 
 name | Type | Description
 --------- | ----------| ------------
-data | json \| object  | Translation data in the [required format](../formatting-translation-data#multiple-language-format)
+data | json \| object  | Translation data in the [required format](/formatting-translation-data#multiple-language-format)
 
 ** Usage: **
 
@@ -100,13 +100,13 @@ store.dispatch(addTranslation(welcomePageTranslations));
 
 ## addTranslationForLanguage(data, language)
 
-Dispatch this action to add translation data for a single language from a json file, or vanilla JS to your redux store. Please see [formatting transaltion data](../formatting-translation-data#single-language-format) to ensure your data is in the proper format. 
+Dispatch this action to add translation data for a single language from a json file, or vanilla JS to your redux store. Please see [formatting transaltion data](/formatting-translation-data#single-language-format) to ensure your data is in the proper format. 
 
 ** Arguments **
 
 name | Type | Description
 --------- | ----------| ------------
-data | json \| object  | Translation data in the [required format](../formatting-translation-data#single-language-format)
+data | json \| object  | Translation data in the [required format](/formatting-translation-data#single-language-format)
 language | string  | The language code this translation data belongs to
 
 ** Usage: **

docs/api/higher-order-component.md

@@ -2,7 +2,7 @@
 
 <div class="admonition important">
   <p class="first admonition-title">Important</p>
-  <p class="last">if your component is already using <a href="https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options" target="_blank">connect</a> then you should use the <a href="../selectors/#gettranslatestate">getTranslate</a>, and <a href="../selectors#getactivelanguagestate">getActiveLanguage</a> selectors instead of <code>localize</code>.</p>
+  <p class="last">if your component is already using <a href="https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options" target="_blank">connect</a> then you should use the <a href="/selectors/#gettranslatestate">getTranslate</a>, and <a href="/selectors#getactivelanguagestate">getActiveLanguage</a> selectors instead of <code>localize</code>.</p>
 </div>
 
 If you have a component that just needs access to translations, and nothing else then you can use the `localize` higher-order function. When you pass your Component to localize it will automatically add [translate](selectors.md#translatekey-string-string-data) and `currentLanguage` to props. 

docs/api/selectors.md

@@ -36,7 +36,7 @@ name | Type | Description
 --------- | ----------| ------------
 key | string \| string [] | Pass a single key or multiple keys from your translation data.
 [data] | object | Optional data to be used in your localized strings for [variable replacement]().
-[options]| object | Optional local override for `renderInnerHtml` option passed to the [initialize](../action-creators/#initializelanguages-options) action creator.
+[options]| object | Optional local override for `renderInnerHtml` option passed to the [initialize](/action-creators/#initializelanguages-options) action creator.
 
 ** Returns: **
 

docs/features.md

@@ -1,7 +1,7 @@
 ## Pass multiple translations to components
 
 To avoid connecting every single component that needs translations you should instead pass translations down to child components.
-To retrieve multiple translations using [translate](../api/selectors#translatekey-string-string-data) pass an array of translation keys instead of a single key. This will return an object with translated strings mapped to translation keys.
+To retrieve multiple translations using [translate](/api/selectors#translatekey-string-string-data) pass an array of translation keys instead of a single key. This will return an object with translated strings mapped to translation keys.
 
 Since `translate` returns an object we can use the object spread operator to pass the translations as props for the `<Article>` component.
 
@@ -49,7 +49,7 @@ Insert dynamic content into your translation strings by inserting placeholders w
 }
 ```
 
-Then pass in the data you want to swap in for placeholders to the [translate](../api/selectors#translatekey-string-string-data) function.
+Then pass in the data you want to swap in for placeholders to the [translate](/api/selectors#translatekey-string-string-data) function.
 
 ```javascript
 <h1>{ translate('greeting', { name: 'Testy McTest' }) }</h1>
@@ -81,7 +81,7 @@ Include HTML in your translation strings and it will be rendered in your compone
 
 ### Handle custom translation data
 
-Does react-localize-redux's supported translation data formats not work for you? That's ok - there is a way for you to use your own custom trnaslation data format. See [Formatting Transltion Data - Custom data format](../formatting-translation-data/#custom-data-format) for full documentation.
+Does react-localize-redux's supported translation data formats not work for you? That's ok - there is a way for you to use your own custom trnaslation data format. See [Formatting Transltion Data - Custom data format](/formatting-translation-data/#custom-data-format) for full documentation.
 
 
 
@@ -134,7 +134,7 @@ Does react-localize-redux's supported translation data formats not work for you?
 
 ## Handle missing translations
 
-If you need a way to detect missing translations you can set the [missingTranslationCallback](../api/action-creators/#initialize-options) option. When set this callback will be triggered anytime the [translate](../api/selectors/#translatekey-string-string-data-options) function detects an `undefined` translation. 
+If you need a way to detect missing translations you can set the [missingTranslationCallback](/api/action-creators/#initialize-options) option. When set this callback will be triggered anytime the [translate](/api/selectors/#translatekey-string-string-data-options) function detects an `undefined` translation. 
 
 ** Example **
 

docs/formatting-translation-data.md

@@ -2,12 +2,12 @@ The translation data for you application will either come from json or vanilla J
 
 ## Multiple language format
 
-> Use **[addTranslation](../api/action-creators#addtranslationdata)** to add data in this format.
+> Use **[addTranslation](/api/action-creators#addtranslationdata)** to add data in this format.
 
 The data is an object where the property name is your translation key, and the value is an array of translations. The translation key is used to identify the translation, and the value is an array that enforces the following...
 
 * Includes a translation for each language your app supports.
-* The order of the translation strings in the array matters! The order **MUST** follow the order of the languages array passed to [setLanguages]([addTranslationForLanguage](../api/action-creators#addtranslationforlanguagedata-language)).
+* The order of the translation strings in the array matters! The order **MUST** follow the order of the languages array passed to [setLanguages]([addTranslationForLanguage](/api/action-creators#addtranslationforlanguagedata-language)).
 
 Assuming your application has dispatched `setLanguages('en', 'fr', 'es')`:
 
@@ -34,7 +34,7 @@ Assuming your application has dispatched `setLanguages('en', 'fr', 'es')`:
 
 ## Single language format
 
-> Use **[addTranslationForLanguage](../api/action-creators#addtranslationforlanguagedata-language)** to add data in this format.
+> Use **[addTranslationForLanguage](/api/action-creators#addtranslationforlanguagedata-language)** to add data in this format.
 
 The data is an object where the property name is your translation key, and the value is the translation for the language. With the single language format you would dispatch `addTranslationForLanguage` for each language you support.
 
@@ -71,19 +71,19 @@ Assuming your application `setLanguages('en', 'fr', 'es')`:
 
 ## Custom data format
 
-If you cannot use the supported data formats there is a way to instruct react-localize-redux on how to handle your custom data. To do this you must pass the [translationTransform](../api/action-creators#initialize-options) option when dispatching the [intialize](../api/action-creators#initializelanguages-options) action, which takes a function in the following format: 
+If you cannot use the supported data formats there is a way to instruct react-localize-redux on how to handle your custom data. To do this you must pass the [translationTransform](/api/action-creators#initialize-options) option when dispatching the [intialize](/api/action-creators#initializelanguages-options) action, which takes a function in the following format: 
 
 ```javascript
 const transformationFunction = (translationData: Object, languagesCodes: string[]) => {
   // Your transformation logic goes here...
 };
 ```
 
-This function is responsible for taking your custom data, and transforming it into the format required by react-localize-redux. You are responsible for writing the transformation logic, but after that the function will be run automatically whenever dispatching [addTranslation](../api/action-creators#addtranslationdata).
+This function is responsible for taking your custom data, and transforming it into the format required by react-localize-redux. You are responsible for writing the transformation logic, but after that the function will be run automatically whenever dispatching [addTranslation](/api/action-creators#addtranslationdata).
 
 <div class="admonition note">
   <p class="first admonition-title">Note</p>
-  <p class="last">The transformation function will not be run if you use the <code><a href="../api/action-creators/#addtranslationforlanguagedata-language">addTranslationForLanguage</a></code> action.</p>
+  <p class="last">The transformation function will not be run if you use the <code><a href="/api/action-creators/#addtranslationforlanguagedata-language">addTranslationForLanguage</a></code> action.</p>
 </div>
 
 ** Example **
@@ -133,7 +133,7 @@ const transformFunction = (translationData, languageCodes) => {
 };
 ```
 
-Now when you dispatch the [intialize](../api/action-creators#initializelanguages-options) action make sure you set the [translationTransform](../api/action-creators#initialize-options) option equal to the `transformFunction`. Now anytime you dispatch the [addTranslation](../api/action-creators#addtranslationdata) action the `transformFunction` will run on the translation data you are adding.
+Now when you dispatch the [intialize](/api/action-creators#initializelanguages-options) action make sure you set the [translationTransform](/api/action-creators#initialize-options) option equal to the `transformFunction`. Now anytime you dispatch the [addTranslation](/api/action-creators#addtranslationdata) action the `transformFunction` will run on the translation data you are adding.
 
 ```javascript
 const languages = ['en', 'fr'];

docs/getting-started.md

@@ -53,7 +53,7 @@ store.dispatch(initialize(languages, { defaultLanguage: 'fr' }));
 
 Typically you will store your translation data in json files, but the data can also be a vanilla JS object. 
 
-In order to add translation data to your application there are two action creators available - [addTranslation](../api/action-creators#addtranslationdata) and [addTranslationForLanguage](../api/action-creators#addtranslationforlanguagedata-language). Which one you use will depend on which format your translation data is in - see [formatting transaltion data]() for more information.
+In order to add translation data to your application there are two action creators available - [addTranslation](/api/action-creators#addtranslationdata) and [addTranslationForLanguage](/api/action-creators#addtranslationforlanguagedata-language). Which one you use will depend on which format your translation data is in - see [formatting transaltion data]() for more information.
 
 <div class="admonition note">
   <p class="first admonition-title">Note</p>
@@ -86,7 +86,7 @@ store.dispatch(addTranslationForLanguage(json, 'en'));
 
 ## 4. Change language
 
-Dispatch [setActiveLanguage](../api/action-creators#setactivelanguagelanguage) and pass the language.
+Dispatch [setActiveLanguage](/api/action-creators#setactivelanguagelanguage) and pass the language.
 
 ```javascript
 import { setActiveLanguage } from 'react-localize-redux';
@@ -101,7 +101,7 @@ store.dispatch(setActiveLanguage('fr'));
 
 ## 5. Translate components
 
-If you have a component that is already using [connect](https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options) use [getTranslate](../api/selectors#gettranslatestate) in your `mapStateToProps` to add the [translate](../api/selectors#translatekey-string-string-data) function to your component's props.
+If you have a component that is already using [connect](https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options) use [getTranslate](/api/selectors#gettranslatestate) in your `mapStateToProps` to add the [translate](/api/selectors#translatekey-string-string-data) function to your component's props.
 
 ```javascript
 import { getTranslate } from 'react-localize-redux';
@@ -121,11 +121,11 @@ const mapStateToProps = state => ({
 export default connect(mapStateToProps)(Greeting);
 ```
 
-For components where you only need access to [translate](../api/selectors#translatekey-string-string-data) and `currentLanguage` you can use [localize](../api/higher-order-component#localizecomponent-reducername). This will automatically connect your component with the `translate` function and `currentLanguage` prop. 
+For components where you only need access to [translate](/api/selectors#translatekey-string-string-data) and `currentLanguage` you can use [localize](/api/higher-order-component#localizecomponent-reducername). This will automatically connect your component with the `translate` function and `currentLanguage` prop. 
 
 <div class="admonition warning">
   <p class="first admonition-title">Warning</p>
-  <p class="last">Components that use <strong>localize</strong> still use <a href="https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options" target="_blank">connect</a> behind the scenes, which means you will want to avoid overusing <strong>localize</strong>. Instead <a href="../features#pass-multiple-translations-to-components">pass multiple translations to components</a> when possible.</p>
+  <p class="last">Components that use <strong>localize</strong> still use <a href="https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options" target="_blank">connect</a> behind the scenes, which means you will want to avoid overusing <strong>localize</strong>. Instead <a href="/features#pass-multiple-translations-to-components">pass multiple translations to components</a> when possible.</p>
 </div>
 
 ```javascript

docs/index.md

@@ -0,0 +1,18 @@
+<p align="center">
+  <img alt="React Localize Redux" src="https://cdn-images-1.medium.com/max/600/1*3Hg5LMvLmWCmEg-ICeUtjg.png">
+</p>
+
+<p align="center">
+  Localization library for <a href="https://facebook.github.io/react">React</a>/<a href="http://redux.js.org/">Redux</a>.
+</p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/react-localize-redux"><img src="https://img.shields.io/npm/dm/react-localize-redux.svg?style=flat-square"></a>
+  <a href="https://travis-ci.org/ryandrewjohnson/react-localize-redux"><img src="https://img.shields.io/travis/ryandrewjohnson/react-localize-redux/master.svg?style=flat-square"></a>
+</p>
+
+## Installation
+
+```bash
+npm install react-localize-redux --save
+```

mkdocs.yml

@@ -1,7 +1,10 @@
 site_name: react-localize-redux
 repo_url: https://github.com/ryandrewjohnson/react-localize-redux
+site_description: 'Localization library for React/Redux.'
+site_author: Ryan Johnson
 
 pages:
+- index.md
 - Getting Started: getting-started.md
 - Formatting Translation Data: formatting-translation-data.md
 - Features: features.md