{"_id":"@benthemonkey/emojione-picker","_rev":"3-644cd7a2b4a1064dc48607219e6adecb","name":"@benthemonkey/emojione-picker","description":"An emoji picker in React","dist-tags":{"latest":"1.1.1"},"versions":{"1.1.1":{"name":"@benthemonkey/emojione-picker","version":"1.1.1","author":{"name":"Tom Moor"},"description":"An emoji picker in React","main":"lib/picker.js","scripts":{"build":"babel src -d lib","preview":"browserify --extension=.jsx -d -t [ babelify ] preview.jsx -o lib/preview.js","watch":"watchify --extension=.jsx -d -t [ babelify ] src/*.jsx preview.jsx -o lib/preview.js","example":"open http://localhost:8080/examples && http-server","prepublish":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/tommoor/emojione-picker.git"},"bugs":{"url":"https://github.com/tommoor/emojione-picker/issues"},"license":"MIT","keywords":["react-component","emojione","emoji","picker","dialog"],"dependencies":{"emojione":"^2.2.6","lodash":"^4.15.0","store":"^1.3.20"},"peerDependencies":{"react":">=0.14.0"},"devDependencies":{"babel-cli":"^6.7.5","babel-preset-es2015":"^6.9.0","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","babelify":"^7.2.0","browserify":"^13.0.0","http-server":"^0.9.0","react":"~15.2.0","react-dom":"~15.2.0","watchify":"^3.7.0"},"gitHead":"4967f98f40051e86df1dcf6616481e3423b8d4a4","homepage":"https://github.com/tommoor/emojione-picker#readme","_id":"@benthemonkey/emojione-picker@1.1.1","_shasum":"39580d403fb6a0508b66d0364ab42f801734df63","_from":".","_npmVersion":"3.10.3","_nodeVersion":"6.4.0","_npmUser":{"name":"benthemonkey","email":"me@bensrothman.com"},"dist":{"shasum":"39580d403fb6a0508b66d0364ab42f801734df63","tarball":"https://registry.npmjs.org/@benthemonkey/emojione-picker/-/emojione-picker-1.1.1.tgz","integrity":"sha512-vgLMBh+C9TWjVgxWPXBviy1O3E+xzRNj2ocuZQ/vnuurMh3H6fZUDxmzGYSNnWjuqawxvTRxvXID0u8PcMsUtA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC8iCDzGio8IY69X8inNTwG+lvNT/Rf4pY+cCHHLgnMJAIhAJdEUypIRue9T0kCDzaypIWyc5SqdN4zkkFMoi5xIpuL"}]},"maintainers":[{"name":"benthemonkey","email":"me@bensrothman.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/emojione-picker-1.1.1.tgz_1482167724635_0.1853252137079835"}}},"readme":"[![npm version](https://badge.fury.io/js/emojione-picker.svg)](https://badge.fury.io/js/emojione-picker)\n\n# Emoji Picker\n\nA friendly Emoji picker for Emojione written as a React component. It looks a little something like this, but is easily customized:\n\n<img src=\"https://raw.githubusercontent.com/tommoor/emojione-picker/master/examples/screenshot.png\" alt=\"Emoji Picker\" style=\"max-width:100%;\" width=\"288px\">\n\n## Installation\n\n`npm install emojione-picker`\n\n\n## Usage\n\nThe npm module includes a pre-transpiled version of the picker so you don't need to run it through your JSX pipeline. Simply require the module like any other.\n\n```javascript\nvar EmojiPicker = require('emojione-picker');\n\n<EmojiPicker onChange={function(data){\n  console.log(\"Emoji chosen\", data);\n}} />\n```\n\nThe module also includes CSS at `css/picker.css` which you can copy and edit or ideally reference directly from within the node_modules directory. Let me know if you're using this in production - i'd love to see it in action!\n\n### Filtering\n\nYou can manually pass in a search term as a component prop to filter which emoji's are displayed by default, for example:\n\n```javascript\n<EmojiPicker search=\"smile\" />\n```\n\nOr allow the user to search by passing a boolean true, this will enable a search input within the picker:\n\n```javascript\n<EmojiPicker search={true} />\n```\n\n<img src=\"https://raw.githubusercontent.com/tommoor/emojione-picker/master/examples/screenshot-search.png\" alt=\"Emoji Picker with Search\" style=\"max-width:100%;\" width=\"288px\">\n\n### Customize Categories\n\nYou can easily customize the category icons by passing in alternatives to the component constructor. The emoji strings come from the shortname value in strategy.js\n\n```javascript\nvar categories = {\n  people: {\n    title:'People',\n    emoji: 'smile'\n  },\n  nature: {\n    title: 'Nature',\n    emoji: 'mouse'\n  },\n  food: {\n    title: 'Food & Drink',\n    emoji: 'burger'\n  }\n}\n\n<EmojiPicker categories={categories} />\n```\n\n### Spritesheets\n\nYou can make the picker use a spritesheet, however this requires a little extra work. Emojione settings can\nbe passed into the Picker component as below. [Follow these instructions](https://github.com/Ranks/emojione#extras) to load the correct spritesheets into your page.\n\n```javascript\nvar settings = {\n  imageType: 'png',\n  sprites: true\n};\n<EmojiPicker categories={categories} emojione={settings} />\n```\n\n## Development\n\n```\nnpm install\nnpm run watch\n```\n\nOpen `examples/index.html` in a browser to see a preview of the picker\n\n## License\n\n[MIT License](http://opensource.org/licenses/MIT)\n\nEmojione is used under the [Creative Commons License (CC-BY 4.0)](http://emojione.com/licensing/) - If you use this component you should also include attribute to Emojione someone within your website or application to satisfy the terms of the license.\n","maintainers":[{"name":"benthemonkey","email":"me@bensrothman.com"}],"time":{"modified":"2022-06-12T15:11:08.497Z","created":"2016-12-19T17:15:25.206Z","1.1.1":"2016-12-19T17:15:25.206Z"},"homepage":"https://github.com/tommoor/emojione-picker#readme","keywords":["react-component","emojione","emoji","picker","dialog"],"repository":{"type":"git","url":"git+https://github.com/tommoor/emojione-picker.git"},"author":{"name":"Tom Moor"},"bugs":{"url":"https://github.com/tommoor/emojione-picker/issues"},"license":"MIT","readmeFilename":"README.md"}