diff --git a/example/webpack.config.js b/example/webpack.config.js index fe31291..f651b40 100644 --- a/example/webpack.config.js +++ b/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'), ], diff --git a/package.json b/package.json index db50cec..c9f730a 100644 --- a/package.json +++ b/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" }, diff --git a/src/components/picker.js b/src/components/picker.js index dc4214e..d2b5f7b 100644 --- a/src/components/picker.js +++ b/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
diff --git a/src/webpack.config.js b/src/webpack.config.js index b3a051b..56c16ab 100644 --- a/src/webpack.config.js +++ b/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'), ], }, diff --git a/yarn.lock b/yarn.lock index 770273a..4310608 100644 --- a/yarn.lock +++ b/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"