{"_id":"@alirezark/react-input-emoji","name":"@alirezark/react-input-emoji","dist-tags":{"latest":"4.1.1"},"versions":{"4.1.1":{"name":"@alirezark/react-input-emoji","version":"4.1.1","description":"A React input with an option to add an emoji","author":{"name":"alirezark"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/alirezark/react-input-emoji.git"},"main":"dist/index.js","types":"dist/index.d.ts","keywords":["emoji","react","input","picker"],"module":"dist/index.es.js","jsnext:main":"dist/index.es.js","engines":{"node":">=8","npm":">=5"},"scripts":{"test":"jest","test:watch":"jest --watch","build":"rollup -c","start":"rollup -c -w","prepare":"yarn run build","predeploy":"cd example && yarn install && yarn run build","deploy":"gh-pages -d example/build"},"peerDependencies":{"prop-types":">=15.7.2","react":">=17.0.x","react-dom":">=17.0.x"},"devDependencies":{"@babel/cli":"^7.14.3","@babel/core":"^7.14.3","@babel/plugin-external-helpers":"^7.12.13","@babel/preset-env":"^7.14.4","@babel/preset-react":"^7.13.13","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-node-resolve":"^13.0.0","@svgr/rollup":"^2.4.1","@testing-library/jest-dom":"^5.13.0","@testing-library/react":"^11.2.7","@testing-library/react-hooks":"^7.0.0","@testing-library/user-event":"^13.1.9","@types/emoji-mart":"^3.0.4","@types/styled-components":"^5.1.9","@typescript-eslint/eslint-plugin":"^4.19.0","@typescript-eslint/parser":"^4.19.0","babel-eslint":"^10.1.0","babel-jest":"^27.0.2","cross-env":"^5.1.4","eslint":"^7.23.0","eslint-config-google":"^0.14.0","eslint-config-prettier":"^8.1.0","eslint-plugin-react":"^7.23.1","eslint-plugin-react-hooks":"^4.2.0","gh-pages":"^1.2.0","jest":"^27.0.4","react":"17.0.2","react-dom":"17.0.2","rollup":"^2.43.1","rollup-plugin-babel":"^4.4.0","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-json":"^4.0.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-postcss":"^3.1.8","rollup-plugin-url":"^3.0.1","typescript":"^4.2.3"},"dependencies":{"emoji-mart":"3.0.1"},"gitHead":"2ebd43964f16a4263c3c9429ef7d51e4198252a4","bugs":{"url":"https://github.com/alirezark/react-input-emoji/issues"},"homepage":"https://github.com/alirezark/react-input-emoji#readme","_id":"@alirezark/react-input-emoji@4.1.1","_nodeVersion":"14.19.1","_npmVersion":"6.14.16","dist":{"integrity":"sha512-POR1ZqpJ6xxXkYUlg3jmn8tCsrDHt7R+cXq1RX1et0E2a5r8Ra1blqmc7aWeoiNhOz95udowo3K+5Kd37y+XMg==","shasum":"7e9b3837d05139a41a5b52a232f4e24518234920","tarball":"https://registry.npmjs.org/@alirezark/react-input-emoji/-/react-input-emoji-4.1.1.tgz","fileCount":7,"unpackedSize":2565967,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHJO32kcpG0XabuhPu05pjKjoCVhaehrKoEzcXBGtoy4AiB6MV5/xa76SgbdUWSbxgpXPG2XRGfTn7HQycLoacpLoA=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjQt1xACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoZUA//TUW+1OWvf8L7ZPzwVdSSy8YallGI/C0nbRYX96Vs/mC9TkbF\r\nvnJ+vSVwBEMlucbSTjeWJPixf1QRbKHIcbj+yaqapFZK2u43PEuZ9uzpVFeL\r\nRHP+Ymu5drX9Au5lYjcRryeX/kuMnjrxwD3yN7aAj96GOh3xqY614XAGCLB1\r\n8IMJeXSeuX5Dj+sQi83N7ZhwRW6HOC+oiAhI7pTO+JfW59SISNbegTHFVurs\r\nJi3tcltPywP6UIZHeP6fj12uZeAtuOiZNzBG+CfqKIEsdLZPKC6tYpwHjjZR\r\nYUwXLb2Pm1TmvUWK0VEXERrfwxizRybiAe/HRt6SC9SnO5Kr+pDhgo9Tvu1a\r\nHVFfORhNjRpkKNldlhdf2P2E5yJvJxGZCG1EZdShoVzqbS1qC1nV3Vdt00c+\r\nTeQT3EiAD9GjMPR4rSjDSlOPNgmKWEejEYo/yPszeRCTWPsNlSDkeMmZowga\r\nXGoeOGuXX7WRhPNeaCcYptOFfZHRMA/vej72ieBqdfm34DHXEHoCmA9wD2E5\r\nRzcaE2ziQjQxKySAoOg8Jp0DG1oi+4fX9eSEJ8LVQqVQDLC2XV6ozYiHgolc\r\nOQxRPXZj61cY1P0k74DAwg5gkv4HlckRZOrDAf3PPgOtetEvO3GEDa+P7ERo\r\ncKFwQQ7M2ggOGDem6RxRWFux7ZsYd/5gc58=\r\n=j7Gq\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"alirezark","email":"Alirezark@gmail.com"},"directories":{},"maintainers":[{"name":"alirezark","email":"Alirezark@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-input-emoji_4.1.1_1665326449403_0.5305953954871978"},"_hasShrinkwrap":false}},"time":{"created":"2022-10-09T14:40:49.326Z","4.1.1":"2022-10-09T14:40:49.594Z","modified":"2022-10-09T14:40:49.734Z"},"maintainers":[{"name":"alirezark","email":"Alirezark@gmail.com"}],"description":"A React input with an option to add an emoji","homepage":"https://github.com/alirezark/react-input-emoji#readme","keywords":["emoji","react","input","picker"],"repository":{"type":"git","url":"git+https://github.com/alirezark/react-input-emoji.git"},"author":{"name":"alirezark"},"bugs":{"url":"https://github.com/alirezark/react-input-emoji/issues"},"license":"MIT","readme":"# react-input-emoji\n\n> A React input with an option to pick emojis\n\n[![NPM](https://img.shields.io/npm/v/react-input-emoji.svg)](https://www.npmjs.com/package/react-input-emoji) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)\n\n<a href=\"https://cesarwbr.github.io/react-input-emoji/\"><img width=\"500\" src=\"https://cesarwbr.github.io/react-input-emoji/assets/images/screely-1566732641740.png\" alt=\"Demo\"></a>\n\n## About\n\nInputEmoji provides a simple way to have an input element with emoji picker support. Click the picker button next to the input field and select an emoji from the popup window. Done!\n\n## Install\n\n```bash\nnpm install --save react-input-emoji\n```\n\n## Usage\n\nAfter install import the react-input-emoji component to display your input with emoji support like so:\n\n```jsx\nimport React, { useState } from \"react\";\nimport InputEmoji from \"react-input-emoji\";\n\nexport default function Example() {\n  const [text, setText] = useState(\"\");\n\n  function handleOnEnter(text) {\n    console.log(\"enter\", text);\n  }\n\n  return (\n    <InputEmoji\n      value={text}\n      onChange={setText}\n      cleanOnEnter\n      onEnter={handleOnEnter}\n      placeholder=\"Type a message\"\n    />\n  );\n}\n```\n\n## Props\n\n| Prop           | Type     | Default          | Description                                                                                                              |\n|----------------|----------|------------------|--------------------------------------------------------------------------------------------------------------------------|\n| `value`        | string   | \"\"               | The input value.                                                                                                         |\n| `onChange`     | function | -                | This function is called when the value of the input changes. The first argument is the current value.                    |\n| `onResize`     | function | -                | This function is called when the width or the height of the input changes. The first argument is the current size value. |\n| `onClick`      | function | -                | This function is called when the input is clicked.                                                                       |\n| `onFocus`      | function | -                | This function is called when the input has received focus.                                                               |\n| `cleanOnEnter` | boolean  | false            | Clean the input value after the keydown event.                                                                           |\n| `onEnter`      | function | -                | This function is called after the keydown event is fired with the `keyCode === 13` returning the last value.             |\n| `placeholder`  | string   | \"Type a message\" | Set the placeholder of the input.                                                                                        |\n| `height`       | number   | 40               | The total height of the area in which the element is rendered.                                                           |\n| `maxLength`    | number   | -                | The maximum number of characters allowed in the element.                                                                 |\n| `theme`        | string   | -                | Set theme for emoji popup. Available values \"light\", \"dark\", \"auto\"                                                      |\n| `borderRadius` | number   | 21               | The border radius of the input container.                                                                                |\n| `borderColor`  | string   | \"#EAEAEA\"        | The border color of the input container.                                                                                 |\n| `fontSize`     | number   | 15               | The font size of the placeholder and input container.                                                                    |\n| `fontFamily`   | string   | \"sans-serif\"     | The font family of the placeholder and input container.                                                                  |\n\n## License\n\nMIT © [cesarwbr](https://github.com/cesarwbr)\n","readmeFilename":"README.md"}