Merge pull request #139 from smiclea/fix-dropdown

Fix dropdown list position

package.json

@@ -61,7 +61,6 @@
     "babel-register": "^6.26.0",
     "copyfiles": "^1.2.0",
     "cross-env": "^5.0.5",
-    "document-offset": "^1.0.4",
     "express": "^4.16.1",
     "file-loader": "^1.1.5",
     "fs": "^0.0.1-security",

src/components/molecules/Dropdown/Dropdown.jsx

@@ -16,7 +16,6 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import styled from 'styled-components'
 import ReactDOM from 'react-dom'
-import offset from 'document-offset'
 
 import { DropdownButton } from 'components'
 
@@ -117,6 +116,7 @@ class Dropdown extends React.Component {
 
   componentDidMount() {
     window.addEventListener('mousedown', this.handlePageClick, false)
+    this.buttonRect = this.buttonRef.getBoundingClientRect()
   }
 
   componentDidUpdate() {
@@ -144,8 +144,7 @@ class Dropdown extends React.Component {
 
     let buttonHeight = this.buttonRef.offsetHeight
     let tipHeight = 8
-    let buttonOffset = offset(this.buttonRef)
-    let listTop = buttonOffset.top + buttonHeight + tipHeight
+    let listTop = this.buttonRect.top + buttonHeight + tipHeight
     let listHeight = this.listRef.offsetHeight
 
     if (listTop + listHeight > window.innerHeight) {
@@ -156,7 +155,7 @@ class Dropdown extends React.Component {
     }
 
     this.listRef.style.top = `${listTop}px`
-    this.listRef.style.left = `${buttonOffset.left}px`
+    this.listRef.style.left = `${this.buttonRect.left}px`
   }
 
   handlePageClick() {

yarn.lock

@@ -2520,14 +2520,6 @@ doctrine@^2.0.0:
     esutils "^2.0.2"
     isarray "^1.0.0"
 
-document-offset@^1.0.4:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/document-offset/-/document-offset-1.0.4.tgz#7345b819cdfef2bb45c63ce13056416063b70085"
-  dependencies:
-    dom-support "*"
-    get-document "1.0.0"
-    within-element "0.1.0"
-
 dom-converter@~0.1:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.1.4.tgz#a45ef5727b890c9bffe6d7c876e7b19cb0e17f3b"
@@ -2545,12 +2537,6 @@ dom-serializer@0, dom-serializer@~0.1.0:
     domelementtype "~1.1.1"
     entities "~1.1.1"
 
-dom-support@*:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/dom-support/-/dom-support-0.0.2.tgz#0e129764ffa5e203d8ab5839e2e92dc2ae14ef7c"
-  dependencies:
-    domready "*"
-
 dom-walk@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.1.tgz#672226dc74c8f799ad35307df936aba11acd6018"
@@ -2579,10 +2565,6 @@ domhandler@^2.3.0:
   dependencies:
     domelementtype "1"
 
-domready@*:
-  version "1.0.8"
-  resolved "https://registry.yarnpkg.com/domready/-/domready-1.0.8.tgz#91f252e597b65af77e745ae24dd0185d5e26d58c"
-
 domutils@1.1:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.1.6.tgz#bddc3de099b9a2efacc51c623f28f416ecc57485"
@@ -3423,10 +3405,6 @@ get-caller-file@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-1.0.2.tgz#f702e63127e7e231c160a80c1554acb70d5047e5"
 
-get-document@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/get-document/-/get-document-1.0.0.tgz#4821bce66f1c24cb0331602be6cb6b12c4f01c4b"
-
 get-stream@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
@@ -7499,10 +7477,6 @@ window-size@0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
 
-within-element@0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/within-element/-/within-element-0.1.0.tgz#b610be314fb588bf21d7bd733906e437f30e2b95"
-
 wordwrap@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.2.tgz#b79669bb42ecb409f83d583cad52ca17eaa1643f"