Create Checkbox component, add Import for multiple accounts

package.json

@@ -38,6 +38,11 @@
     "webpack-sources": "1.0.1"
   },
   "dependencies": {
+    "@fortawesome/fontawesome": "^1.1.3",
+    "@fortawesome/fontawesome-free-brands": "^5.0.6",
+    "@fortawesome/fontawesome-free-regular": "^5.0.6",
+    "@fortawesome/fontawesome-free-solid": "^5.0.6",
+    "@fortawesome/react-fontawesome": "^0.0.17",
     "@ledgerhq/common": "2.0.5",
     "@ledgerhq/hw-app-btc": "^2.1.0",
     "@ledgerhq/hw-app-eth": "^2.1.0",
@@ -50,7 +55,7 @@
     "bs58check": "^2.1.1",
     "color": "^3.0.0",
     "cross-env": "^5.1.3",
-    "downshift": "^1.25.0",
+    "downshift": "^1.26.0",
     "electron-store": "^1.3.0",
     "electron-updater": "^2.20.1",
     "fuse.js": "^3.2.0",
@@ -81,12 +86,12 @@
     "styled-system": "^1.1.1"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "^3.3.10",
-    "@storybook/addon-knobs": "^3.3.10",
-    "@storybook/addon-links": "^3.3.10",
-    "@storybook/addon-options": "^3.3.10",
-    "@storybook/addons": "^3.3.10",
-    "@storybook/react": "^3.3.10",
+    "@storybook/addon-actions": "^3.3.11",
+    "@storybook/addon-knobs": "^3.3.11",
+    "@storybook/addon-links": "^3.3.11",
+    "@storybook/addon-options": "^3.3.11",
+    "@storybook/addons": "^3.3.11",
+    "@storybook/react": "^3.3.11",
     "babel-core": "^6.26.0",
     "babel-eslint": "^8.2.1",
     "babel-loader": "^7.1.2",
@@ -108,7 +113,7 @@
     "eslint-plugin-flowtype": "^2.42.0",
     "eslint-plugin-import": "^2.8.0",
     "eslint-plugin-jsx-a11y": "^6.0.3",
-    "eslint-plugin-react": "^7.6.0",
+    "eslint-plugin-react": "^7.6.1",
     "flow-bin": "^0.64.0",
     "flow-typed": "^2.2.3",
     "husky": "^0.14.3",

src/components/ReceiveBox.js

@@ -65,7 +65,7 @@ const ReceiveBox = ({ address }: Props) => (
         <span>{'Print'}</span>
       </Action>
       <Action>
-        <Icon name="share-square-o" />
+        <Icon name="share-square" />
         <span>{'Share'}</span>
       </Action>
     </Box>

src/components/SideBar/index.js

@@ -70,7 +70,7 @@ class SideBar extends PureComponent<Props> {
           <Box flow={2}>
             <CapsSubtitle>{t('sidebar.menu')}</CapsSubtitle>
             <div>
-              <Item icon="bar-chart" linkTo="/">
+              <Item icon="chart-bar" linkTo="/">
                 {t('dashboard.title')}
               </Item>
               <Item icon="upload" modal="send">

src/components/base/Checkbox/index.js

@@ -0,0 +1,93 @@
+// @flow
+
+import React, { PureComponent } from 'react'
+import styled from 'styled-components'
+
+import Box from 'components/base/Box'
+import Icon from 'components/base/Icon'
+
+const Base = styled(Box).attrs({
+  align: 'center',
+  justify: 'center',
+  relative: true,
+})`
+  background-color: ${p => (p.checked ? p.theme.colors.blue : p.theme.colors.white)};
+  box-shadow: 0 0 0 ${p => (p.checked ? 4 : 1)}px
+    ${p => (p.checked ? p.theme.colors.cream : p.theme.colors.argile)};
+  border-radius: 50%;
+  font-size: 7px;
+
+  height: 19px;
+  width: 19px;
+  transition: all ease-in-out 0.1s;
+
+  input[type='checkbox'] {
+    bottom: 0;
+    cursor: pointer;
+    height: 100%;
+    left: 0;
+    opacity: 0;
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 100%;
+    z-index: 10;
+  }
+
+  > span {
+    position: relative;
+    top: 1px;
+    opacity: ${p => (p.checked ? 1 : 0)};
+    transition: all ease-in-out 0.1s;
+  }
+`
+
+type Props = {
+  checked?: boolean,
+  onChange?: Function,
+}
+
+type State = {
+  checked: boolean,
+}
+
+class Checkbox extends PureComponent<Props, State> {
+  state = {
+    checked: this.props.checked || false,
+  }
+
+  componentWillReceiveProps(nextProps: Props) {
+    if (nextProps.checked) {
+      this.setState({
+        checked: nextProps.checked,
+      })
+    }
+  }
+
+  handleChange = (e: SyntheticInputEvent<HTMLInputElement>) => {
+    const { onChange } = this.props
+    const { checked } = e.target
+
+    this.setState({
+      checked,
+    })
+
+    if (onChange) {
+      onChange(checked)
+    }
+  }
+
+  render() {
+    const { checked } = this.state
+    const { onChange, ...props } = this.props
+
+    return (
+      <Base {...props}>
+        <input type="checkbox" checked={checked} onChange={this.handleChange} />
+        <Icon color="white" name="check" />
+      </Base>
+    )
+  }
+}
+
+export default Checkbox

src/components/base/Checkbox/stories.js

@@ -0,0 +1,9 @@
+import React from 'react'
+import { storiesOf } from '@storybook/react'
+import { boolean } from '@storybook/addon-knobs'
+
+import Checkbox from 'components/base/Checkbox'
+
+const stories = storiesOf('Checkbox', module)
+
+stories.add('basic', () => <Checkbox checked={boolean('checked', false)} />)

src/components/base/Icon.js

@@ -3,15 +3,15 @@
 import React from 'react'
 import styled from 'styled-components'
 import { fontSize, color } from 'styled-system'
+import FontAwesomeIcon from '@fortawesome/react-fontawesome'
 
-const Container = styled.div`
+const Container = styled.span`
   ${fontSize};
   ${color};
-  line-height: 1;
 `
 
 export default ({ name, ...props }: { name: string }) => (
   <Container {...props}>
-    <i className={`fa fa-${name}`} />
+    <FontAwesomeIcon icon={name} fixedWidth />
   </Container>
 )

src/components/base/Modal/index.js

@@ -50,7 +50,7 @@ const Container = styled(Box).attrs({
     pointerEvents: p.isVisible ? 'auto' : 'none',
   }),
 })`
-  overflow: hidden;
+  overflow: scroll;
   position: fixed;
   z-index: 20;
 `
@@ -69,6 +69,7 @@ const Wrapper = styled(Box).attrs({
   bg: 'transparent',
   flow: 20,
   mt: 100,
+  mb: 100,
   style: p => ({
     opacity: p.op,
     transform: `translate3d(0, ${p.offset}px, 0)`,

src/components/base/Select/index.js

@@ -91,7 +91,7 @@ const FloatingTriangles = styled(Box).attrs({
 
 class Select extends PureComponent<Props> {
   static defaultProps = {
-    itemToString: (item: Object) => item.name,
+    itemToString: (item: Object) => item && item.name,
     keyProp: undefined,
   }
 

src/components/modals/AddAccount/ImportAccounts.js

@@ -1,24 +1,40 @@
 // @flow
 
 import React, { PureComponent } from 'react'
+import { translate } from 'react-i18next'
+
+import type { T } from 'types/common'
 
 import { formatBTC } from 'helpers/format'
 
 import Box from 'components/base/Box'
 import Button from 'components/base/Button'
+import Checkbox from 'components/base/Checkbox'
+import Input from 'components/base/Input'
 
 type Props = {
+  t: T,
   accounts: Array<Object>,
   onImportAccounts: Function,
 }
 
 type State = {
   accountsSelected: Array<string>,
+  accountsName: Object,
 }
 
 class ImportAccounts extends PureComponent<Props, State> {
   state = {
     accountsSelected: [],
+    accountsName: this.props.accounts.reduce((result, value, index) => {
+      result[value.id] = {
+        placeholder: this.props.t(`addAccount.import.placeholder`, {
+          index: index + 1,
+        }),
+      }
+
+      return result
+    }, {}),
   }
 
   handleSelectAccount = (id: string, selected: boolean) => () =>
@@ -28,9 +44,32 @@ class ImportAccounts extends PureComponent<Props, State> {
         : [...prev.accountsSelected, id],
     }))
 
-  render() {
+  handleChangeInput = (id: string) => (value: string) =>
+    this.setState(prev => ({
+      accountsName: {
+        ...prev.accountsName,
+        [id]: {
+          ...prev.accountsName[id],
+          value,
+        },
+      },
+    }))
+
+  handleImportAccounts = () => {
     const { accounts, onImportAccounts } = this.props
-    const { accountsSelected } = this.state
+    const { accountsSelected, accountsName } = this.state
+
+    const importAccounts = accountsSelected.map(id => ({
+      ...accounts.find(a => a.id === id),
+      name: accountsName[id].value || accountsName[id].placeholder,
+    }))
+
+    onImportAccounts(importAccounts)
+  }
+
+  render() {
+    const { accounts } = this.props
+    const { accountsSelected, accountsName } = this.state
 
     const canImportAccounts = accountsSelected.length > 0
 
@@ -40,15 +79,25 @@ class ImportAccounts extends PureComponent<Props, State> {
         <Box>
           {accounts.map(account => {
             const selected = accountsSelected.includes(account.id)
+            const accountName = accountsName[account.id]
             return (
-              <Box
-                key={account.id}
-                horizontal
-                flow={10}
-                onClick={this.handleSelectAccount(account.id, selected)}
-              >
-                <Box>{selected ? 'yes' : 'no'}</Box>
+              <Box key={account.id} horizontal flow={10}>
+                <Box>
+                  <Checkbox
+                    checked={selected}
+                    onChange={this.handleSelectAccount(account.id, selected)}
+                  />
+                </Box>
                 <Box>
+                  <Box>
+                    <Input
+                      type="text"
+                      disabled={!selected}
+                      placeholder={accountName.placeholder}
+                      value={accountName.value || ''}
+                      onChange={this.handleChangeInput(account.id)}
+                    />
+                  </Box>
                   <Box>Balance: {formatBTC(account.balance)}</Box>
                   <Box>Transactions: {account.transactions.length}</Box>
                 </Box>
@@ -57,11 +106,7 @@ class ImportAccounts extends PureComponent<Props, State> {
           })}
         </Box>
         <Box>
-          <Button
-            primary
-            disabled={!canImportAccounts}
-            onClick={onImportAccounts(accountsSelected)}
-          >
+          <Button primary disabled={!canImportAccounts} onClick={this.handleImportAccounts}>
             Import accounts
           </Button>
         </Box>
@@ -70,4 +115,4 @@ class ImportAccounts extends PureComponent<Props, State> {
   }
 }
 
-export default ImportAccounts
+export default translate()(ImportAccounts)

src/components/modals/AddAccount/index.js

@@ -262,20 +262,18 @@ class AddAccountModal extends PureComponent<Props, State> {
     })
   }
 
-  handleImportAccounts = accountsSelected => () => {
-    const { inputValue, accounts } = this.state
+  handleImportAccounts = accountsSelected => {
+    const { inputValue } = this.state
     const { addAccount } = this.props
 
-    Object.entries(accounts).forEach(([, account]: [string, any], i) => {
-      if (accountsSelected.includes(account.id)) {
-        addAccount({
-          id: account.id,
-          name: `Account ${i + 1}`,
-          type: inputValue.wallet,
-          data: account,
-        })
-      }
-    })
+    accountsSelected.forEach(({ id, name, ...account }) =>
+      addAccount({
+        id,
+        name,
+        type: inputValue.wallet,
+        data: account,
+      }),
+    )
   }
 
   handleChangeInput = (key: $Keys<InputValue>) => (value: $Values<InputValue>) =>

src/renderer/head.js

@@ -1,8 +0,0 @@
-const list = ['https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css']
-
-list.forEach(href => {
-  const tag = document.createElement('link')
-  tag.setAttribute('rel', 'stylesheet')
-  tag.setAttribute('href', href)
-  document.head.appendChild(tag)
-})

src/renderer/index.js

@@ -17,7 +17,6 @@ import { getLanguage } from 'reducers/settings'
 import App from 'components/App'
 
 import 'styles/global'
-import 'renderer/head'
 
 if (__PROD__ && __SENTRY_URL__) {
   Raven.config(__SENTRY_URL__, { allowSecretKey: true }).install()

src/styles/global.js

@@ -1,8 +1,11 @@
 // @flow
 
+/* eslint-disable no-unused-expressions */
+
 import { injectGlobal } from 'styled-components'
+import '@fortawesome/fontawesome-free-solid'
+import '@fortawesome/fontawesome-free-regular'
 
-/* eslint-disable no-unused-expressions */
 injectGlobal`
   * {
     box-sizing: border-box;

static/i18n/en/translation.yml

@@ -1,9 +1,6 @@
 common:
   ok: Okay
   cancel: Cancel
-  connectedDevices: You have {{count}} device connected
-  connectedDevices_0: You don't have device connected
-  connectedDevices_plural: You have {{count}} devices connected
 
 language:
   en: English
@@ -26,6 +23,9 @@ receive:
 addAccount:
   title: Add account
 
+  import:
+    placeholder: Account {{index}}
+
 settings:
   title: Settings
 

static/i18n/fr/translation.yml

@@ -1,9 +1,6 @@
 common:
   ok: Okay
   cancel: Annuler
-  connectedDevices: You have {{count}} device connected
-  connectedDevices_0: You don't have device connected
-  connectedDevices_plural: You have {{count}} devices connected
 
 language:
   en: Anglais
@@ -26,6 +23,9 @@ receive:
 addAccount:
   title: Ajouter un compte
 
+  import:
+    placeholder: Compte {{index}}
+
 settings:
   title: Réglages
 

yarn.lock

@@ -78,6 +78,40 @@
     lodash "^4.2.0"
     to-fast-properties "^2.0.0"
 
+"@fortawesome/fontawesome-common-types@^0.1.2":
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.1.2.tgz#d6aa075058f0c984d6e2ebcbc0052c1f7f9bea72"
+
+"@fortawesome/fontawesome-free-brands@^5.0.6":
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-brands/-/fontawesome-free-brands-5.0.6.tgz#fee054ce0c4d74019020f6353ca85cfb408de719"
+  dependencies:
+    "@fortawesome/fontawesome-common-types" "^0.1.2"
+
+"@fortawesome/fontawesome-free-regular@^5.0.6":
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-regular/-/fontawesome-free-regular-5.0.6.tgz#fafc624025a247c1a1bbb5080b9902a490cd79f5"
+  dependencies:
+    "@fortawesome/fontawesome-common-types" "^0.1.2"
+
+"@fortawesome/fontawesome-free-solid@^5.0.6":
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free-solid/-/fontawesome-free-solid-5.0.6.tgz#6bb5acdd081b03ab25b7684f7089b37ed3d20740"
+  dependencies:
+    "@fortawesome/fontawesome-common-types" "^0.1.2"
+
+"@fortawesome/fontawesome@^1.1.3":
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome/-/fontawesome-1.1.3.tgz#7a4844345cbc7fb238f5f1788af73bd302ee9b80"
+  dependencies:
+    "@fortawesome/fontawesome-common-types" "^0.1.2"
+
+"@fortawesome/react-fontawesome@^0.0.17":
+  version "0.0.17"
+  resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.0.17.tgz#69abd135523187044f533cadc5458f829d43961f"
+  dependencies:
+    humps "^2.0.1"
+
 "@ledgerhq/common@2.0.5":
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/@ledgerhq/common/-/common-2.0.5.tgz#5f5eca4ac907914d700540c20b3d733cd7a25a93"
@@ -118,9 +152,9 @@
   dependencies:
     events "^1.1.1"
 
-"@storybook/addon-actions@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-3.3.10.tgz#f3e4b538d8260364c55a3ba1e301a2fab9d8d3f2"
+"@storybook/addon-actions@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-3.3.11.tgz#158a64f01c97fcf6922e7a370c6519d216544bcd"
   dependencies:
     deep-equal "^1.0.1"
     global "^4.3.2"
@@ -129,9 +163,9 @@
     react-inspector "^2.2.2"
     uuid "^3.1.0"
 
-"@storybook/addon-knobs@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-knobs/-/addon-knobs-3.3.10.tgz#25f32cd3d32a1667dc9d8ae484ddfd6223fcffef"
+"@storybook/addon-knobs@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-knobs/-/addon-knobs-3.3.11.tgz#ab53a627f9517d922e1a1f6b874bd76ae2fc3b08"
   dependencies:
     babel-runtime "^6.26.0"
     deep-equal "^1.0.1"
@@ -145,41 +179,41 @@
     react-textarea-autosize "^5.2.1"
     util-deprecate "^1.0.2"
 
-"@storybook/addon-links@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-3.3.10.tgz#4e6c1a0b0bf5b18101bc5001b858b33202ae8209"
+"@storybook/addon-links@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-3.3.11.tgz#7bc57baddd1502153ee94cf11fcb88d49131b211"
   dependencies:
-    "@storybook/components" "^3.3.10"
+    "@storybook/components" "^3.3.11"
     global "^4.3.2"
     prop-types "^15.5.10"
 
-"@storybook/addon-options@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/addon-options/-/addon-options-3.3.10.tgz#536796b6223616a4a8b3c2851c7efbe66036bc8a"
+"@storybook/addon-options@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/addon-options/-/addon-options-3.3.11.tgz#2e4a5fd9b4a5875104aed232dff0f7f257a9611b"
 
-"@storybook/addons@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-3.3.10.tgz#8753007d872013d2376ba71b14396eef3159673b"
+"@storybook/addons@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-3.3.11.tgz#7f85136d6da785160658aee512fd3cac99780f42"
 
-"@storybook/channel-postmessage@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-3.3.10.tgz#4f22b5a665d3c95eb61cf41bbb06872009ace7b5"
+"@storybook/channel-postmessage@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-3.3.11.tgz#a379f96f7819ba3752bb471ebf90ad07c3fc28ea"
   dependencies:
-    "@storybook/channels" "^3.3.10"
+    "@storybook/channels" "^3.3.11"
     global "^4.3.2"
     json-stringify-safe "^5.0.1"
 
-"@storybook/channels@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-3.3.10.tgz#0b15d47c2ea0cb1c7b735955d74e9d3ca99cdc42"
+"@storybook/channels@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-3.3.11.tgz#569f1c7c364aeb076df78eb829c58f9c9f0a3936"
 
-"@storybook/client-logger@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-3.3.10.tgz#6f8b85c3dfad229794fee88f930df59b163ee144"
+"@storybook/client-logger@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-3.3.11.tgz#35c851dbed2067201189847c7aa92f8d567a4d61"
 
-"@storybook/components@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/components/-/components-3.3.10.tgz#f213a129ed49de33cdaf116da2c2b662b8eb3ea0"
+"@storybook/components@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/components/-/components-3.3.11.tgz#cb2a48b52e7cb45408172f4462f4730ca6970e78"
   dependencies:
     glamor "^2.20.40"
     glamorous "^4.11.2"
@@ -193,9 +227,9 @@
     "@storybook/react-simple-di" "^1.2.1"
     babel-runtime "6.x.x"
 
-"@storybook/node-logger@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-3.3.10.tgz#d9c09a622713ec4726cdd292e798aa98c0503c15"
+"@storybook/node-logger@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-3.3.11.tgz#e459cbf8da75e2671a08de4f6dfe32b556b20af6"
   dependencies:
     chalk "^2.3.0"
     npmlog "^4.1.2"
@@ -225,17 +259,17 @@
   dependencies:
     babel-runtime "^6.5.0"
 
-"@storybook/react@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/react/-/react-3.3.10.tgz#a55f8f804f3f01d76f1b7e8675e818ee4c107324"
-  dependencies:
-    "@storybook/addon-actions" "^3.3.10"
-    "@storybook/addon-links" "^3.3.10"
-    "@storybook/addons" "^3.3.10"
-    "@storybook/channel-postmessage" "^3.3.10"
-    "@storybook/client-logger" "^3.3.10"
-    "@storybook/node-logger" "^3.3.10"
-    "@storybook/ui" "^3.3.10"
+"@storybook/react@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/react/-/react-3.3.11.tgz#5438d40aa095dd7b0c2f4e8e51a83fd5151df0c1"
+  dependencies:
+    "@storybook/addon-actions" "^3.3.11"
+    "@storybook/addon-links" "^3.3.11"
+    "@storybook/addons" "^3.3.11"
+    "@storybook/channel-postmessage" "^3.3.11"
+    "@storybook/client-logger" "^3.3.11"
+    "@storybook/node-logger" "^3.3.11"
+    "@storybook/ui" "^3.3.11"
     airbnb-js-shims "^1.4.0"
     autoprefixer "^7.2.3"
     babel-loader "^7.1.2"
@@ -287,11 +321,11 @@
     webpack-dev-middleware "^1.12.2"
     webpack-hot-middleware "^2.21.0"
 
-"@storybook/ui@^3.3.10":
-  version "3.3.10"
-  resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-3.3.10.tgz#99a83b988b01cde1df61b87a58227a50ed196dd1"
+"@storybook/ui@^3.3.11":
+  version "3.3.11"
+  resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-3.3.11.tgz#df500b97739da484d51d6a1bcb52ce3866ad2148"
   dependencies:
-    "@storybook/components" "^3.3.10"
+    "@storybook/components" "^3.3.11"
     "@storybook/mantra-core" "^1.7.2"
     "@storybook/react-komposer" "^2.0.3"
     babel-runtime "^6.26.0"
@@ -3126,9 +3160,9 @@ dotenv@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-4.0.0.tgz#864ef1379aced55ce6f95debecdce179f7a0cd1d"
 
-downshift@^1.25.0:
-  version "1.25.0"
-  resolved "https://registry.yarnpkg.com/downshift/-/downshift-1.25.0.tgz#7f6e2dda4aa5ddbb2932401bd61e7b741e92c02e"
+downshift@^1.26.0:
+  version "1.26.0"
+  resolved "https://registry.yarnpkg.com/downshift/-/downshift-1.26.0.tgz#1ee954fef129861f977c6b9effe93fb78e7dc363"
 
 duplexer3@^0.1.4:
   version "0.1.4"
@@ -3602,9 +3636,9 @@ eslint-plugin-jsx-a11y@^6.0.3:
     emoji-regex "^6.1.0"
     jsx-ast-utils "^2.0.0"
 
-eslint-plugin-react@^7.6.0:
-  version "7.6.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.6.0.tgz#351651188c74c5b2fecc2717e3936b7207baa728"
+eslint-plugin-react@^7.6.1:
+  version "7.6.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.6.1.tgz#5d0e908be599f0c02fbf4eef0c7ed6f29dff7633"
   dependencies:
     doctrine "^2.0.2"
     has "^1.0.1"
@@ -4758,6 +4792,10 @@ https-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
 
+humps@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/humps/-/humps-2.0.1.tgz#dd02ea6081bd0568dc5d073184463957ba9ef9aa"
+
 husky@^0.14.3:
   version "0.14.3"
   resolved "https://registry.yarnpkg.com/husky/-/husky-0.14.3.tgz#c69ed74e2d2779769a17ba8399b54ce0b63c12c3"