NimblePicker: Cannot read property 'id' of undefined

[Rojoss]

Hi, I'm getting the following errors in my production builds.
When running it locally the picker works fine but then when I build it and deploy it I get this error.

I'm building with WebPack, here is the webpack config and package.json.
https://gist.github.com/Rojoss/c3bf23017316317ca25819171d120f71

This is the React code:

<Picker backgroundImageFn={() => '/img/emojis.png'} emojiSize={30} set='twitter' onClick={this.onEmojiPick} custom={[]} emoji='' color='#ee427b' showPreview={false} title='EmojiQuiz' perLine={50} />

Also tried with the NimblePicker

const data = require('../../node_modules/emoji-mart/data/twitter.json');
const NimblePicker = require('emoji-mart').NimblePicker;

<NimblePicker set='twitter' data={data} backgroundImageFn={() => '/img/emojis.png'} emojiSize={30} onClick={this.onEmojiPick} custom={[]} emoji='' color='#ee427b' showPreview={false} title='EmojiQuiz' perLine={50} />

The emoji set or any of the other props don't make any difference.
When I add the component without any properties it still triggers the error below.

Uncaught TypeError: Cannot read property 'id' of undefined
    at getData (index.9b4636908dba122169e1.js:4155)
    at index.9b4636908dba122169e1.js:1941
    at Array.filter (<anonymous>)
    at Category.getEmojis (index.9b4636908dba122169e1.js:1940)
    at Category.render (index.9b4636908dba122169e1.js:1988)
    at finishClassComponent (index.9b4636908dba122169e1.js:24825)
    at updateClassComponent (index.9b4636908dba122169e1.js:24787)
    at beginWork (index.9b4636908dba122169e1.js:25456)
    at performUnitOfWork (index.9b4636908dba122169e1.js:27495)
    at workLoop (index.9b4636908dba122169e1.js:27534)
index.9b4636908dba122169e1.js:25858 The above error occurred in the <Category> component:
    in Category (created by NimblePicker)
    in div (created by NimblePicker)
    in div (created by NimblePicker)
    in NimblePicker (created by Index)
    in div (created by Index)
    in form (created by Index)
    in div (created by Index)
    in div (created by Index)
    in Index (created by Route)
    in Route (created by Router)
    in div (created by Router)
    in Router (created by ConnectedRouter)
    in ConnectedRouter (created by Router)
    in Router (created by RootApp)
    in div (created by RootApp)
    in RootApp
    in Provider
    in AppContainer

React will try to recreate this component tree from scratch using the error boundary you provided, AppContainer.

[pravinjohn]

Hi, try removing perLine.. i had the same issue. Just use width@style.

[nolanlawson]

I cannot reproduce this using the code provided (by pasting it into the storybook: nolanlawson@1e7e879). Could you please provide a reproducible test case or steps to reproduce? Thanks!

[nolanlawson]

Nevermind, I managed to reproduce: #289