Include scrollbar width in total picker width

example/webpack.config.js

@@ -16,6 +16,7 @@ module.exports = {
         loader: 'babel-loader',
         include: [
           path.resolve('src'),
+          path.resolve('node_modules/measure-scrollbar'),
           path.resolve('data'),
           path.resolve('example'),
         ],

package.json

@@ -18,7 +18,9 @@
     "url": "https://github.com/missive/emoji-mart/issues"
   },
   "homepage": "https://github.com/missive/emoji-mart",
-  "dependencies": {},
+  "dependencies": {
+    "measure-scrollbar": "^0.1.0"
+  },
   "peerDependencies": {
     "react": "^0.14.0 || ^15.0.0-0"
   },

src/components/picker.js

@@ -2,6 +2,7 @@ import '../vendor/raf-polyfill'
 
 import React from 'react'
 import PropTypes from 'prop-types'
+import measureScrollbar from 'measure-scrollbar'
 import data from '../../data'
 
 import store from '../utils/store'
@@ -328,7 +329,7 @@ export default class Picker extends React.Component {
   render() {
     var { perLine, emojiSize, set, sheetSize, style, title, emoji, color, native, backgroundImageFn, emojisToShowFilter, include, exclude, autoFocus } = this.props,
         { skin } = this.state,
-        width = (perLine * (emojiSize + 12)) + 12 + 2
+        width = (perLine * (emojiSize + 12)) + 12 + 2 + measureScrollbar()
 
     return <div style={{width: width, ...style}} className='emoji-mart'>
       <div className='emoji-mart-bar'>

src/webpack.config.js

@@ -30,6 +30,7 @@ module.exports = {
         loader: 'babel-loader',
         include: [
           path.resolve('src'),
+          path.resolve('node_modules/measure-scrollbar'),
           path.resolve('data'),
         ],
       },

yarn.lock

@@ -1712,6 +1712,10 @@ lru-cache@2.2.x:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-2.2.4.tgz#6c658619becf14031d0d0b594b16042ce4dc063d"
 
+measure-scrollbar@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/measure-scrollbar/-/measure-scrollbar-0.1.0.tgz#2bbfac6773bcbb98d814e6890554c0b92846fe6f"
+
 media-typer@0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"