react-textarea-emoji

Text Area to use emojis while typing

Demo page
↑/↓ Move the selection in the emoji list
Enter Validate the selection
Escape Leave the emoji list selection
The emoji list appears automatically when typing a colon followed by a letter :a

Install

npm install --save react-textarea-emoji

Props

Name	Description
textAreaStyle	Set a particular style to the textarea

Usage

import React, { Component } from 'react'

import { TextAreaEmoji } from 'react-textarea-emoji'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'react-textarea-emoji/dist/index.css';

class Example extends Component {
  render() {
    return (
      <TextAreaEmoji
        style={{
          position: 'fixed',
          top: '30%',
          left: '50%',
          transform: 'translateX(-50%)',
        }}
        textAreaStyle={{
          fontSize: '20pt',
        }}/>
    );
  }
}

export default Example

Emojis

The emoji list is actually small, to increase the possibility, just complete the file by adding a json object in the emojis object array:

{"char": "🌷", "name": "tulip", "shortname": ":tulip:", "unicode": "1f337"}