Proyectos de Subversion LeadersLinked - Antes de SPA

import React from "react";

export const EmojiPeople = (props) => {
  // props destructuring
  const { onClickEmoji, hidden } = props;
  return (
    <div
      className="smiley-panel-body"
      style={{ display: hidden ? "block" : "none" }}
    >
      <div className="emoji-people">
        <span
          onClick={(e) => onClickEmoji(e)}
          className="e1"
          id="1f600"
          data-shortname=":grinning:"
          data-index="1"
          title="grinning face"
          data-eid="735"
        >
          <span className="emojione emojione-1f600"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f601"
          data-shortname=":grin:"
          data-index="2"
          title="grinning face with smiling eyes"
          data-eid="621"
        >
          <span className="emojione emojione-1f601"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f602"
          data-shortname=":joy:"
          data-index="3"
          title="face with tears of joy"
          data-eid="622"
        >
          <span className="emojione emojione-1f602"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f923"
          data-shortname=":rofl:"
          data-index="4"
          title="rolling on the floor laughing"
          data-eid="2256"
        >
          <span className="emojione emojione-1f923"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f603"
          data-shortname=":smiley:"
          data-index="5"
          title="smiling face with open mouth"
          data-eid="623"
        >
          <span className="emojione emojione-1f603"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f604"
          data-shortname=":smile:"
          data-index="6"
          title="smiling face with open mouth and smiling eyes"
          data-eid="625"
        >
          <span className="emojione emojione-1f604"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f605"
          data-shortname=":sweat_smile:"
          data-index="7"
          title="smiling face with open mouth and cold sweat"
          data-eid="626"
        >
          <span className="emojione emojione-1f605"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f606"
          data-shortname=":laughing:"
          data-index="8"
          title="smiling face with open mouth and tightly-closed eyes"
          data-eid="628"
        >
          <span className="emojione emojione-1f606"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f609"
          data-shortname=":wink:"
          data-index="9"
          title="winking face"
          data-eid="629"
        >
          <span className="emojione emojione-1f609"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f60a"
          data-shortname=":blush:"
          data-index="10"
          title="smiling face with smiling eyes"
          data-eid="631"
        >
          <span className="emojione emojione-1f60a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f60b"
          data-shortname=":yum:"
          data-index="11"
          title="face savouring delicious food"
          data-eid="632"
        >
          <span className="emojione emojione-1f60b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f60e"
          data-shortname=":sunglasses:"
          data-index="12"
          title="smiling face with sunglasses"
          data-eid="738"
        >
          <span className="emojione emojione-1f60e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f60d"
          data-shortname=":heart_eyes:"
          data-index="13"
          title="smiling face with heart-shaped eyes"
          data-eid="635"
        >
          <span className="emojione emojione-1f60d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f618"
          data-shortname=":kissing_heart:"
          data-index="14"
          title="face throwing a kiss"
          data-eid="644"
        >
          <span className="emojione emojione-1f618"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f617"
          data-shortname=":kissing:"
          data-index="15"
          title="kissing face"
          data-eid="742"
        >
          <span className="emojione emojione-1f617"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f619"
          data-shortname=":kissing_smiling_eyes:"
          data-index="16"
          title="kissing face with smiling eyes"
          data-eid="743"
        >
          <span className="emojione emojione-1f619"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f61a"
          data-shortname=":kissing_closed_eyes:"
          data-index="17"
          title="kissing face with closed eyes"
          data-eid="646"
        >
          <span className="emojione emojione-1f61a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="263a"
          data-shortname=":relaxed:"
          data-index="18"
          title="white smiling face"
          data-eid="53"
        >
          <span className="emojione emojione-263a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f642"
          data-shortname=":slight_smile:"
          data-index="19"
          title="slightly smiling face"
          data-eid="1233"
        >
          <span className="emojione emojione-1f642"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f917"
          data-shortname=":hugging:"
          data-index="20"
          title="hugging face"
          data-eid="2079"
        >
          <span className="emojione emojione-1f917"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f914"
          data-shortname=":thinking:"
          data-index="21"
          title="thinking face"
          data-eid="2081"
        >
          <span className="emojione emojione-1f914"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f610"
          data-shortname=":neutral_face:"
          data-index="22"
          title="neutral face"
          data-eid="739"
        >
          <span className="emojione emojione-1f610"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f611"
          data-shortname=":expressionless:"
          data-index="23"
          title="expressionless face"
          data-eid="740"
        >
          <span className="emojione emojione-1f611"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f636"
          data-shortname=":no_mouth:"
          data-index="24"
          title="face without mouth"
          data-eid="752"
        >
          <span className="emojione emojione-1f636"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f644"
          data-shortname=":rolling_eyes:"
          data-index="25"
          title="face with rolling eyes"
          data-eid="2080"
        >
          <span className="emojione emojione-1f644"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f60f"
          data-shortname=":smirk:"
          data-index="26"
          title="smirking face"
          data-eid="637"
        >
          <span className="emojione emojione-1f60f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f623"
          data-shortname=":persevere:"
          data-index="27"
          title="persevering face"
          data-eid="655"
        >
          <span className="emojione emojione-1f623"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f625"
          data-shortname=":disappointed_relieved:"
          data-index="28"
          title="disappointed but relieved face"
          data-eid="657"
        >
          <span className="emojione emojione-1f625"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f62e"
          data-shortname=":open_mouth:"
          data-index="29"
          title="face with open mouth"
          data-eid="749"
        >
          <span className="emojione emojione-1f62e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f910"
          data-shortname=":zipper_mouth:"
          data-index="30"
          title="zipper-mouth face"
          data-eid="2082"
        >
          <span className="emojione emojione-1f910"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f62f"
          data-shortname=":hushed:"
          data-index="31"
          title="hushed face"
          data-eid="750"
        >
          <span className="emojione emojione-1f62f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f62a"
          data-shortname=":sleepy:"
          data-index="32"
          title="sleepy face"
          data-eid="660"
        >
          <span className="emojione emojione-1f62a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f62b"
          data-shortname=":tired_face:"
          data-index="33"
          title="tired face"
          data-eid="661"
        >
          <span className="emojione emojione-1f62b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f634"
          data-shortname=":sleeping:"
          data-index="34"
          title="sleeping face"
          data-eid="751"
        >
          <span className="emojione emojione-1f634"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f60c"
          data-shortname=":relieved:"
          data-index="35"
          title="relieved face"
          data-eid="634"
        >
          <span className="emojione emojione-1f60c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f913"
          data-shortname=":nerd:"
          data-index="36"
          title="nerd face"
          data-eid="2078"
        >
          <span className="emojione emojione-1f913"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f61b"
          data-shortname=":stuck_out_tongue:"
          data-index="37"
          title="face with stuck-out tongue"
          data-eid="744"
        >
          <span className="emojione emojione-1f61b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f61c"
          data-shortname=":stuck_out_tongue_winking_eye:"
          data-index="38"
          title="face with stuck-out tongue and winking eye"
          data-eid="647"
        >
          <span className="emojione emojione-1f61c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f61d"
          data-shortname=":stuck_out_tongue_closed_eyes:"
          data-index="39"
          title="face with stuck-out tongue and tightly-closed eyes"
          data-eid="649"
        >
          <span className="emojione emojione-1f61d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f924"
          data-shortname=":drooling_face:"
          data-index="40"
          title="drooling face"
          data-eid="2257"
        >
          <span className="emojione emojione-1f924"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f612"
          data-shortname=":unamused:"
          data-index="41"
          title="unamused face"
          data-eid="638"
        >
          <span className="emojione emojione-1f612"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f613"
          data-shortname=":sweat:"
          data-index="42"
          title="face with cold sweat"
          data-eid="640"
        >
          <span className="emojione emojione-1f613"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f614"
          data-shortname=":pensive:"
          data-index="43"
          title="pensive face"
          data-eid="641"
        >
          <span className="emojione emojione-1f614"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f615"
          data-shortname=":confused:"
          data-index="44"
          title="confused face"
          data-eid="741"
        >
          <span className="emojione emojione-1f615"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f643"
          data-shortname=":upside_down:"
          data-index="45"
          title="upside-down face"
          data-eid="2075"
        >
          <span className="emojione emojione-1f643"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f911"
          data-shortname=":money_mouth:"
          data-index="46"
          title="money-mouth face"
          data-eid="2077"
        >
          <span className="emojione emojione-1f911"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f632"
          data-shortname=":astonished:"
          data-index="47"
          title="astonished face"
          data-eid="665"
        >
          <span className="emojione emojione-1f632"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="2639"
          data-shortname=":frowning2:"
          data-index="48"
          title="white frowning face"
          data-eid="1670"
        >
          <span className="emojione emojione-2639"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f641"
          data-shortname=":slight_frown:"
          data-index="49"
          title="slightly frowning face"
          data-eid="1232"
        >
          <span className="emojione emojione-1f641"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f616"
          data-shortname=":confounded:"
          data-index="50"
          title="confounded face"
          data-eid="643"
        >
          <span className="emojione emojione-1f616"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f61e"
          data-shortname=":disappointed:"
          data-index="51"
          title="disappointed face"
          data-eid="650"
        >
          <span className="emojione emojione-1f61e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f61f"
          data-shortname=":worried:"
          data-index="52"
          title="worried face"
          data-eid="745"
        >
          <span className="emojione emojione-1f61f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f624"
          data-shortname=":triumph:"
          data-index="53"
          title="face with look of triumph"
          data-eid="656"
        >
          <span className="emojione emojione-1f624"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f622"
          data-shortname=":cry:"
          data-index="54"
          title="crying face"
          data-eid="654"
        >
          <span className="emojione emojione-1f622"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f62d"
          data-shortname=":sob:"
          data-index="55"
          title="loudly crying face"
          data-eid="662"
        >
          <span className="emojione emojione-1f62d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f626"
          data-shortname=":frowning:"
          data-index="56"
          title="frowning face with open mouth"
          data-eid="746"
        >
          <span className="emojione emojione-1f626"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f627"
          data-shortname=":anguished:"
          data-index="57"
          title="anguished face"
          data-eid="747"
        >
          <span className="emojione emojione-1f627"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f628"
          data-shortname=":fearful:"
          data-index="58"
          title="fearful face"
          data-eid="658"
        >
          <span className="emojione emojione-1f628"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f629"
          data-shortname=":weary:"
          data-index="59"
          title="weary face"
          data-eid="659"
        >
          <span className="emojione emojione-1f629"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f62c"
          data-shortname=":grimacing:"
          data-index="60"
          title="grimacing face"
          data-eid="748"
        >
          <span className="emojione emojione-1f62c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f630"
          data-shortname=":cold_sweat:"
          data-index="61"
          title="face with open mouth and cold sweat"
          data-eid="663"
        >
          <span className="emojione emojione-1f630"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f631"
          data-shortname=":scream:"
          data-index="62"
          title="face screaming in fear"
          data-eid="664"
        >
          <span className="emojione emojione-1f631"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f633"
          data-shortname=":flushed:"
          data-index="63"
          title="flushed face"
          data-eid="666"
        >
          <span className="emojione emojione-1f633"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f635"
          data-shortname=":dizzy_face:"
          data-index="64"
          title="dizzy face"
          data-eid="667"
        >
          <span className="emojione emojione-1f635"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f621"
          data-shortname=":rage:"
          data-index="65"
          title="pouting face"
          data-eid="653"
        >
          <span className="emojione emojione-1f621"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f620"
          data-shortname=":angry:"
          data-index="66"
          title="angry face"
          data-eid="652"
        >
          <span className="emojione emojione-1f620"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f607"
          data-shortname=":innocent:"
          data-index="67"
          title="smiling face with halo"
          data-eid="736"
        >
          <span className="emojione emojione-1f607"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f920"
          data-shortname=":cowboy:"
          data-index="68"
          title="face with cowboy hat"
          data-eid="2253"
        >
          <span className="emojione emojione-1f920"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f921"
          data-shortname=":clown:"
          data-index="69"
          title="clown face"
          data-eid="2254"
        >
          <span className="emojione emojione-1f921"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f925"
          data-shortname=":lying_face:"
          data-index="70"
          title="lying face"
          data-eid="2258"
        >
          <span className="emojione emojione-1f925"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f637"
          data-shortname=":mask:"
          data-index="71"
          title="face with medical mask"
          data-eid="668"
        >
          <span className="emojione emojione-1f637"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f912"
          data-shortname=":thermometer_face:"
          data-index="72"
          title="face with thermometer"
          data-eid="2083"
        >
          <span className="emojione emojione-1f912"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f915"
          data-shortname=":head_bandage:"
          data-index="73"
          title="face with head-bandage"
          data-eid="2084"
        >
          <span className="emojione emojione-1f915"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f922"
          data-shortname=":nauseated_face:"
          data-index="74"
          title="nauseated face"
          data-eid="2255"
        >
          <span className="emojione emojione-1f922"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f927"
          data-shortname=":sneezing_face:"
          data-index="75"
          title="sneezing face"
          data-eid="2259"
        >
          <span className="emojione emojione-1f927"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f608"
          data-shortname=":smiling_imp:"
          data-index="76"
          title="smiling face with horns"
          data-eid="737"
        >
          <span className="emojione emojione-1f608"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f47f"
          data-shortname=":imp:"
          data-index="77"
          title="imp"
          data-eid="446"
        >
          <span className="emojione emojione-1f47f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f479"
          data-shortname=":japanese_ogre:"
          data-index="78"
          title="japanese ogre"
          data-eid="440"
        >
          <span className="emojione emojione-1f479"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f47a"
          data-shortname=":japanese_goblin:"
          data-index="79"
          title="japanese goblin"
          data-eid="441"
        >
          <span className="emojione emojione-1f47a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f480"
          data-shortname=":skull:"
          data-index="80"
          title="skull"
          data-eid="447"
        >
          <span className="emojione emojione-1f480"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f47b"
          data-shortname=":ghost:"
          data-index="81"
          title="ghost"
          data-eid="442"
        >
          <span className="emojione emojione-1f47b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f47d"
          data-shortname=":alien:"
          data-index="82"
          title="extraterrestrial alien"
          data-eid="444"
        >
          <span className="emojione emojione-1f47d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f916"
          data-shortname=":robot:"
          data-index="83"
          title="robot face"
          data-eid="2085"
        >
          <span className="emojione emojione-1f916"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f4a9"
          data-shortname=":poop:"
          data-index="84"
          title="pile of poo"
          data-eid="548"
        >
          <span className="emojione emojione-1f4a9"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f63a"
          data-shortname=":smiley_cat:"
          data-index="85"
          title="smiling cat face with open mouth"
          data-eid="671"
        >
          <span className="emojione emojione-1f63a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f638"
          data-shortname=":smile_cat:"
          data-index="86"
          title="grinning cat face with smiling eyes"
          data-eid="669"
        >
          <span className="emojione emojione-1f638"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f639"
          data-shortname=":joy_cat:"
          data-index="87"
          title="cat face with tears of joy"
          data-eid="670"
        >
          <span className="emojione emojione-1f639"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f63b"
          data-shortname=":heart_eyes_cat:"
          data-index="88"
          title="smiling cat face with heart-shaped eyes"
          data-eid="672"
        >
          <span className="emojione emojione-1f63b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f63c"
          data-shortname=":smirk_cat:"
          data-index="89"
          title="cat face with wry smile"
          data-eid="673"
        >
          <span className="emojione emojione-1f63c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f63d"
          data-shortname=":kissing_cat:"
          data-index="90"
          title="kissing cat face with closed eyes"
          data-eid="674"
        >
          <span className="emojione emojione-1f63d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f640"
          data-shortname=":scream_cat:"
          data-index="91"
          title="weary cat face"
          data-eid="677"
        >
          <span className="emojione emojione-1f640"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f63f"
          data-shortname=":crying_cat_face:"
          data-index="92"
          title="crying cat face"
          data-eid="676"
        >
          <span className="emojione emojione-1f63f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f63e"
          data-shortname=":pouting_cat:"
          data-index="93"
          title="pouting cat face"
          data-eid="675"
        >
          <span className="emojione emojione-1f63e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f466"
          data-tone="0"
          data-shortname=":boy:"
          data-index="94"
          title="boy"
          data-eid="423"
        >
          <span className="emojione emojione-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f467"
          data-tone="0"
          data-shortname=":girl:"
          data-index="95"
          title="girl"
          data-eid="424"
        >
          <span className="emojione emojione-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468"
          data-tone="0"
          data-shortname=":man:"
          data-index="96"
          title="man"
          data-eid="425"
        >
          <span className="emojione emojione-1f468"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469"
          data-tone="0"
          data-shortname=":woman:"
          data-index="97"
          title="woman"
          data-eid="426"
        >
          <span className="emojione emojione-1f469"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f474"
          data-tone="0"
          data-shortname=":older_man:"
          data-index="98"
          title="older man"
          data-eid="435"
        >
          <span className="emojione emojione-1f474"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f475"
          data-tone="0"
          data-shortname=":older_woman:"
          data-index="99"
          title="older woman"
          data-eid="436"
        >
          <span className="emojione emojione-1f475"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f476"
          data-tone="0"
          data-shortname=":baby:"
          data-index="100"
          title="baby"
          data-eid="437"
        >
          <span className="emojione emojione-1f476"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f47c"
          data-tone="0"
          data-shortname=":angel:"
          data-index="101"
          title="baby angel"
          data-eid="443"
        >
          <span className="emojione emojione-1f47c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f46e"
          data-tone="0"
          data-shortname=":cop:"
          data-index="102"
          title="police officer"
          data-eid="429"
        >
          <span className="emojione emojione-1f46e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f575"
          data-tone="0"
          data-shortname=":spy:"
          data-index="103"
          title="sleuth or spy"
          data-eid="1217"
        >
          <span className="emojione emojione-1f575"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f482"
          data-tone="0"
          data-shortname=":guardsman:"
          data-index="104"
          title="guardsman"
          data-eid="450"
        >
          <span className="emojione emojione-1f482"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f477"
          data-tone="0"
          data-shortname=":construction_worker:"
          data-index="105"
          title="construction worker"
          data-eid="438"
        >
          <span className="emojione emojione-1f477"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f473"
          data-tone="0"
          data-shortname=":man_with_turban:"
          data-index="106"
          title="man with turban"
          data-eid="434"
        >
          <span className="emojione emojione-1f473"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f471"
          data-tone="0"
          data-shortname=":person_with_blond_hair:"
          data-index="107"
          title="person with blond hair"
          data-eid="432"
        >
          <span className="emojione emojione-1f471"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f385"
          data-tone="0"
          data-shortname=":santa:"
          data-index="108"
          title="father christmas"
          data-eid="271"
        >
          <span className="emojione emojione-1f385"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f936"
          data-shortname=":mrs_claus:"
          data-index="109"
          title="mother christmas"
          data-eid="2262"
        >
          <span className="emojione emojione-1f936"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f478"
          data-tone="0"
          data-shortname=":princess:"
          data-index="110"
          title="princess"
          data-eid="439"
        >
          <span className="emojione emojione-1f478"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f934"
          data-shortname=":prince:"
          data-index="111"
          title="prince"
          data-eid="2260"
        >
          <span className="emojione emojione-1f934"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f470"
          data-tone="0"
          data-shortname=":bride_with_veil:"
          data-index="112"
          title="bride with veil"
          data-eid="431"
        >
          <span className="emojione emojione-1f470"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f935"
          data-shortname=":man_in_tuxedo:"
          data-index="113"
          title="man in tuxedo"
          data-eid="2261"
        >
          <span className="emojione emojione-1f935"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f930"
          data-shortname=":pregnant_woman:"
          data-index="114"
          title="pregnant woman"
          data-eid="2265"
        >
          <span className="emojione emojione-1f930"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f472"
          data-tone="0"
          data-shortname=":man_with_gua_pi_mao:"
          data-index="115"
          title="man with gua pi mao"
          data-eid="433"
        >
          <span className="emojione emojione-1f472"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f64d"
          data-tone="0"
          data-shortname=":person_frowning:"
          data-index="116"
          title="person frowning"
          data-eid="686"
        >
          <span className="emojione emojione-1f64d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f64e"
          data-tone="0"
          data-shortname=":person_with_pouting_face:"
          data-index="117"
          title="person with pouting face"
          data-eid="687"
        >
          <span className="emojione emojione-1f64e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f645"
          data-tone="0"
          data-shortname=":no_good:"
          data-index="118"
          title="face with no good gesture"
          data-eid="678"
        >
          <span className="emojione emojione-1f645"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f646"
          data-tone="0"
          data-shortname=":ok_woman:"
          data-index="119"
          title="face with ok gesture"
          data-eid="679"
        >
          <span className="emojione emojione-1f646"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f481"
          data-tone="0"
          data-shortname=":information_desk_person:"
          data-index="120"
          title="information desk person"
          data-eid="449"
        >
          <span className="emojione emojione-1f481"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f64b"
          data-tone="0"
          data-shortname=":raising_hand:"
          data-index="121"
          title="happy person raising one hand"
          data-eid="684"
        >
          <span className="emojione emojione-1f64b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f647"
          data-tone="0"
          data-shortname=":bow:"
          data-index="122"
          title="person bowing deeply"
          data-eid="680"
        >
          <span className="emojione emojione-1f647"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f926"
          data-shortname=":face_palm:"
          data-index="123"
          title="face palm"
          data-eid="2263"
        >
          <span className="emojione emojione-1f926"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f937"
          data-shortname=":shrug:"
          data-index="124"
          title="shrug"
          data-eid="2264"
        >
          <span className="emojione emojione-1f937"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f486"
          data-tone="0"
          data-shortname=":massage:"
          data-index="125"
          title="face massage"
          data-eid="455"
        >
          <span className="emojione emojione-1f486"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f487"
          data-tone="0"
          data-shortname=":haircut:"
          data-index="126"
          title="haircut"
          data-eid="457"
        >
          <span className="emojione emojione-1f487"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f6b6"
          data-tone="0"
          data-shortname=":walking:"
          data-index="127"
          title="pedestrian"
          data-eid="715"
        >
          <span className="emojione emojione-1f6b6"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f3c3"
          data-tone="0"
          data-shortname=":runner:"
          data-index="128"
          title="runner"
          data-eid="321"
        >
          <span className="emojione emojione-1f3c3"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f483"
          data-tone="0"
          data-shortname=":dancer:"
          data-index="129"
          title="dancer"
          data-eid="451"
        >
          <span className="emojione emojione-1f483"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f57a"
          data-shortname=":man_dancing:"
          data-index="130"
          title="man dancing"
          data-eid="2267"
        >
          <span className="emojione emojione-1f57a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f46f"
          data-shortname=":dancers:"
          data-index="131"
          title="woman with bunny ears"
          data-eid="430"
        >
          <span className="emojione emojione-1f46f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f5e3"
          data-shortname=":speaking_head:"
          data-index="132"
          title="speaking head in silhouette"
          data-eid="1186"
        >
          <span className="emojione emojione-1f5e3"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f464"
          data-shortname=":bust_in_silhouette:"
          data-index="133"
          title="bust in silhouette"
          data-eid="422"
        >
          <span className="emojione emojione-1f464"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f465"
          data-shortname=":busts_in_silhouette:"
          data-index="134"
          title="busts in silhouette"
          data-eid="825"
        >
          <span className="emojione emojione-1f465"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f46b"
          data-shortname=":couple:"
          data-index="135"
          title="man and woman holding hands"
          data-eid="428"
        >
          <span className="emojione emojione-1f46b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f46c"
          data-shortname=":two_men_holding_hands:"
          data-index="136"
          title="two men holding hands"
          data-eid="826"
        >
          <span className="emojione emojione-1f46c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f46d"
          data-shortname=":two_women_holding_hands:"
          data-index="137"
          title="two women holding hands"
          data-eid="827"
        >
          <span className="emojione emojione-1f46d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f48f"
          data-shortname=":couplekiss:"
          data-index="138"
          title="kiss"
          data-eid="473"
        >
          <span className="emojione emojione-1f48f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-2764-1f48b-1f468"
          data-shortname=":kiss_mm:"
          data-index="139"
          title="kiss (man,man)"
          data-eid="1630"
        >
          <span className="emojione emojione-1f468-2764-1f48b-1f468"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-2764-1f48b-1f469"
          data-shortname=":kiss_ww:"
          data-index="140"
          title="kiss (woman,woman)"
          data-eid="1629"
        >
          <span className="emojione emojione-1f469-2764-1f48b-1f469"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f491"
          data-shortname=":couple_with_heart:"
          data-index="141"
          title="couple with heart"
          data-eid="477"
        >
          <span className="emojione emojione-1f491"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-2764-1f468"
          data-shortname=":couple_mm:"
          data-index="142"
          title="couple (man,man)"
          data-eid="1628"
        >
          <span className="emojione emojione-1f468-2764-1f468"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-2764-1f469"
          data-shortname=":couple_ww:"
          data-index="143"
          title="couple (woman,woman)"
          data-eid="1627"
        >
          <span className="emojione emojione-1f469-2764-1f469"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f46a"
          data-shortname=":family:"
          data-index="144"
          title="family"
          data-eid="427"
        >
          <span className="emojione emojione-1f46a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f469-1f467"
          data-shortname=":family_mwg:"
          data-index="145"
          title="family (man,woman,girl)"
          data-eid="1619"
        >
          <span className="emojione emojione-1f468-1f469-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f469-1f467-1f466"
          data-shortname=":family_mwgb:"
          data-index="146"
          title="family (man,woman,girl,boy)"
          data-eid="1620"
        >
          <span className="emojione emojione-1f468-1f469-1f467-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f469-1f466-1f466"
          data-shortname=":family_mwbb:"
          data-index="147"
          title="family (man,woman,boy,boy)"
          data-eid="1618"
        >
          <span className="emojione emojione-1f468-1f469-1f466-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f469-1f467-1f467"
          data-shortname=":family_mwgg:"
          data-index="148"
          title="family (man,woman,girl,girl)"
          data-eid="1621"
        >
          <span className="emojione emojione-1f468-1f469-1f467-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f468-1f466"
          data-shortname=":family_mmb:"
          data-index="149"
          title="family (man,man,boy)"
          data-eid="1613"
        >
          <span className="emojione emojione-1f468-1f468-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f468-1f467"
          data-shortname=":family_mmg:"
          data-index="150"
          title="family (man,man,girl)"
          data-eid="1615"
        >
          <span className="emojione emojione-1f468-1f468-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f468-1f467-1f466"
          data-shortname=":family_mmgb:"
          data-index="151"
          title="family (man,man,girl,boy)"
          data-eid="1616"
        >
          <span className="emojione emojione-1f468-1f468-1f467-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f468-1f466-1f466"
          data-shortname=":family_mmbb:"
          data-index="152"
          title="family (man,man,boy,boy)"
          data-eid="1614"
        >
          <span className="emojione emojione-1f468-1f468-1f466-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f468-1f468-1f467-1f467"
          data-shortname=":family_mmgg:"
          data-index="153"
          title="family (man,man,girl,girl)"
          data-eid="1617"
        >
          <span className="emojione emojione-1f468-1f468-1f467-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-1f469-1f466"
          data-shortname=":family_wwb:"
          data-index="154"
          title="family (woman,woman,boy)"
          data-eid="1622"
        >
          <span className="emojione emojione-1f469-1f469-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-1f469-1f467"
          data-shortname=":family_wwg:"
          data-index="155"
          title="family (woman,woman,girl)"
          data-eid="1624"
        >
          <span className="emojione emojione-1f469-1f469-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-1f469-1f467-1f466"
          data-shortname=":family_wwgb:"
          data-index="156"
          title="family (woman,woman,girl,boy)"
          data-eid="1625"
        >
          <span className="emojione emojione-1f469-1f469-1f467-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-1f469-1f466-1f466"
          data-shortname=":family_wwbb:"
          data-index="157"
          title="family (woman,woman,boy,boy)"
          data-eid="1623"
        >
          <span className="emojione emojione-1f469-1f469-1f466-1f466"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f469-1f469-1f467-1f467"
          data-shortname=":family_wwgg:"
          data-index="158"
          title="family (woman,woman,girl,girl)"
          data-eid="1626"
        >
          <span className="emojione emojione-1f469-1f469-1f467-1f467"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f4aa"
          data-tone="0"
          data-shortname=":muscle:"
          data-index="159"
          title="flexed biceps"
          data-eid="550"
        >
          <span className="emojione emojione-1f4aa"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f933"
          data-shortname=":selfie:"
          data-index="160"
          title="selfie"
          data-eid="2266"
        >
          <span className="emojione emojione-1f933"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f448"
          data-tone="0"
          data-shortname=":point_left:"
          data-index="161"
          title="white left pointing backhand index"
          data-eid="394"
        >
          <span className="emojione emojione-1f448"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f449"
          data-tone="0"
          data-shortname=":point_right:"
          data-index="162"
          title="white right pointing backhand index"
          data-eid="395"
        >
          <span className="emojione emojione-1f449"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="261d"
          data-tone="0"
          data-shortname=":point_up:"
          data-index="163"
          title="white up pointing index"
          data-eid="52"
        >
          <span className="emojione emojione-261d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f446"
          data-tone="0"
          data-shortname=":point_up_2:"
          data-index="164"
          title="white up pointing backhand index"
          data-eid="392"
        >
          <span className="emojione emojione-1f446"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f595"
          data-tone="0"
          data-shortname=":middle_finger:"
          data-index="165"
          title="reversed hand with middle finger extended"
          data-eid="1225"
        >
          <span className="emojione emojione-1f595"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f447"
          data-tone="0"
          data-shortname=":point_down:"
          data-index="166"
          title="white down pointing backhand index"
          data-eid="393"
        >
          <span className="emojione emojione-1f447"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="270c"
          data-tone="0"
          data-shortname=":v:"
          data-index="167"
          title="victory hand"
          data-eid="96"
        >
          <span className="emojione emojione-270c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f91e"
          data-shortname=":fingers_crossed:"
          data-index="168"
          title="hand with first and index finger crossed"
          data-eid="2273"
        >
          <span className="emojione emojione-1f91e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f596"
          data-tone="0"
          data-shortname=":vulcan:"
          data-index="169"
          title="raised hand with part between middle and ring fingers"
          data-eid="1226"
        >
          <span className="emojione emojione-1f596"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f918"
          data-tone="0"
          data-shortname=":metal:"
          data-index="170"
          title="sign of the horns"
          data-eid="728"
        >
          <span className="emojione emojione-1f918"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f919"
          data-shortname=":call_me:"
          data-index="171"
          title="call me hand"
          data-eid="2268"
        >
          <span className="emojione emojione-1f919"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f590"
          data-tone="0"
          data-shortname=":hand_splayed:"
          data-index="172"
          title="raised hand with fingers splayed"
          data-eid="1220"
        >
          <span className="emojione emojione-1f590"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="270b"
          data-tone="0"
          data-shortname=":raised_hand:"
          data-index="173"
          title="raised hand"
          data-eid="95"
        >
          <span className="emojione emojione-270b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f44c"
          data-tone="0"
          data-shortname=":ok_hand:"
          data-index="174"
          title="ok hand sign"
          data-eid="398"
        >
          <span className="emojione emojione-1f44c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f44d"
          data-tone="0"
          data-shortname=":thumbsup:"
          data-index="175"
          title="thumbs up sign"
          data-eid="399"
        >
          <span className="emojione emojione-1f44d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f44e"
          data-tone="0"
          data-shortname=":thumbsdown:"
          data-index="176"
          title="thumbs down sign"
          data-eid="400"
        >
          <span className="emojione emojione-1f44e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="270a"
          data-tone="0"
          data-shortname=":fist:"
          data-index="177"
          title="raised fist"
          data-eid="94"
        >
          <span className="emojione emojione-270a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f44a"
          data-tone="0"
          data-shortname=":punch:"
          data-index="178"
          title="fisted hand sign"
          data-eid="396"
        >
          <span className="emojione emojione-1f44a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f91b"
          data-shortname=":left_facing_fist:"
          data-index="179"
          title="left-facing fist"
          data-eid="2270"
        >
          <span className="emojione emojione-1f91b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f91c"
          data-shortname=":right_facing_fist:"
          data-index="180"
          title="right-facing fist"
          data-eid="2271"
        >
          <span className="emojione emojione-1f91c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f91a"
          data-shortname=":raised_back_of_hand:"
          data-index="181"
          title="raised back of hand"
          data-eid="2269"
        >
          <span className="emojione emojione-1f91a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f44b"
          data-tone="0"
          data-shortname=":wave:"
          data-index="182"
          title="waving hand sign"
          data-eid="397"
        >
          <span className="emojione emojione-1f44b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f44f"
          data-tone="0"
          data-shortname=":clap:"
          data-index="183"
          title="clapping hands sign"
          data-eid="401"
        >
          <span className="emojione emojione-1f44f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="270d"
          data-tone="0"
          data-shortname=":writing_hand:"
          data-index="184"
          title="writing hand"
          data-eid="1218"
        >
          <span className="emojione emojione-270d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f450"
          data-tone="0"
          data-shortname=":open_hands:"
          data-index="185"
          title="open hands sign"
          data-eid="402"
        >
          <span className="emojione emojione-1f450"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f64c"
          data-tone="0"
          data-shortname=":raised_hands:"
          data-index="186"
          title="person raising both hands in celebration"
          data-eid="685"
        >
          <span className="emojione emojione-1f64c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f64f"
          data-tone="0"
          data-shortname=":pray:"
          data-index="187"
          title="person with folded hands"
          data-eid="688"
        >
          <span className="emojione emojione-1f64f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f91d"
          data-shortname=":handshake:"
          data-index="188"
          title="handshake"
          data-eid="2272"
        >
          <span className="emojione emojione-1f91d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f485"
          data-tone="0"
          data-shortname=":nail_care:"
          data-index="189"
          title="nail polish"
          data-eid="453"
        >
          <span className="emojione emojione-1f485"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f442"
          data-tone="0"
          data-shortname=":ear:"
          data-index="190"
          title="ear"
          data-eid="388"
        >
          <span className="emojione emojione-1f442"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f443"
          data-tone="0"
          data-shortname=":nose:"
          data-index="191"
          title="nose"
          data-eid="389"
        >
          <span className="emojione emojione-1f443"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f463"
          data-shortname=":footprints:"
          data-index="192"
          title="footprints"
          data-eid="421"
        >
          <span className="emojione emojione-1f463"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f440"
          data-shortname=":eyes:"
          data-index="193"
          title="eyes"
          data-eid="387"
        >
          <span className="emojione emojione-1f440"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f441"
          data-shortname=":eye:"
          data-index="194"
          title="eye"
          data-eid="1215"
        >
          <span className="emojione emojione-1f441"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f445"
          data-shortname=":tongue:"
          data-index="195"
          title="tongue"
          data-eid="391"
        >
          <span className="emojione emojione-1f445"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f444"
          data-shortname=":lips:"
          data-index="196"
          title="mouth"
          data-eid="390"
        >
          <span className="emojione emojione-1f444"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f48b"
          data-shortname=":kiss:"
          data-index="197"
          title="kiss mark"
          data-eid="465"
        >
          <span className="emojione emojione-1f48b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f4a4"
          data-shortname=":zzz:"
          data-index="198"
          title="sleeping symbol"
          data-eid="533"
        >
          <span className="emojione emojione-1f4a4"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f453"
          data-shortname=":eyeglasses:"
          data-index="199"
          title="eyeglasses"
          data-eid="405"
        >
          <span className="emojione emojione-1f453"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f576"
          data-shortname=":dark_sunglasses:"
          data-index="200"
          title="dark sunglasses"
          data-eid="1127"
        >
          <span className="emojione emojione-1f576"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f454"
          data-shortname=":necktie:"
          data-index="201"
          title="necktie"
          data-eid="406"
        >
          <span className="emojione emojione-1f454"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f455"
          data-shortname=":shirt:"
          data-index="202"
          title="t-shirt"
          data-eid="407"
        >
          <span className="emojione emojione-1f455"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f456"
          data-shortname=":jeans:"
          data-index="203"
          title="jeans"
          data-eid="408"
        >
          <span className="emojione emojione-1f456"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f457"
          data-shortname=":dress:"
          data-index="204"
          title="dress"
          data-eid="409"
        >
          <span className="emojione emojione-1f457"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f458"
          data-shortname=":kimono:"
          data-index="205"
          title="kimono"
          data-eid="410"
        >
          <span className="emojione emojione-1f458"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f459"
          data-shortname=":bikini:"
          data-index="206"
          title="bikini"
          data-eid="411"
        >
          <span className="emojione emojione-1f459"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f45a"
          data-shortname=":womans_clothes:"
          data-index="207"
          title="womans clothes"
          data-eid="412"
        >
          <span className="emojione emojione-1f45a"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f45b"
          data-shortname=":purse:"
          data-index="208"
          title="purse"
          data-eid="413"
        >
          <span className="emojione emojione-1f45b"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f45c"
          data-shortname=":handbag:"
          data-index="209"
          title="handbag"
          data-eid="414"
        >
          <span className="emojione emojione-1f45c"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f45d"
          data-shortname=":pouch:"
          data-index="210"
          title="pouch"
          data-eid="415"
        >
          <span className="emojione emojione-1f45d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f392"
          data-shortname=":school_satchel:"
          data-index="211"
          title="school satchel"
          data-eid="284"
        >
          <span className="emojione emojione-1f392"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f45e"
          data-shortname=":mans_shoe:"
          data-index="212"
          title="mans shoe"
          data-eid="416"
        >
          <span className="emojione emojione-1f45e"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f45f"
          data-shortname=":athletic_shoe:"
          data-index="213"
          title="athletic shoe"
          data-eid="417"
        >
          <span className="emojione emojione-1f45f"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f460"
          data-shortname=":high_heel:"
          data-index="214"
          title="high-heeled shoe"
          data-eid="418"
        >
          <span className="emojione emojione-1f460"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f461"
          data-shortname=":sandal:"
          data-index="215"
          title="womans sandal"
          data-eid="419"
        >
          <span className="emojione emojione-1f461"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f462"
          data-shortname=":boot:"
          data-index="216"
          title="womans boots"
          data-eid="420"
        >
          <span className="emojione emojione-1f462"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f451"
          data-shortname=":crown:"
          data-index="217"
          title="crown"
          data-eid="403"
        >
          <span className="emojione emojione-1f451"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f452"
          data-shortname=":womans_hat:"
          data-index="218"
          title="womans hat"
          data-eid="404"
        >
          <span className="emojione emojione-1f452"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f3a9"
          data-shortname=":tophat:"
          data-index="219"
          title="top hat"
          data-eid="295"
        >
          <span className="emojione emojione-1f3a9"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f393"
          data-shortname=":mortar_board:"
          data-index="220"
          title="graduation cap"
          data-eid="285"
        >
          <span className="emojione emojione-1f393"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="26d1"
          data-shortname=":helmet_with_cross:"
          data-index="221"
          title="helmet with white cross"
          data-eid="1682"
        >
          <span className="emojione emojione-26d1"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f484"
          data-shortname=":lipstick:"
          data-index="222"
          title="lipstick"
          data-eid="452"
        >
          <span className="emojione emojione-1f484"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f48d"
          data-shortname=":ring:"
          data-index="223"
          title="ring"
          data-eid="469"
        >
          <span className="emojione emojione-1f48d"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f302"
          data-shortname=":closed_umbrella:"
          data-index="224"
          title="closed umbrella"
          data-eid="175"
        >
          <span className="emojione emojione-1f302"></span>
        </span>
        <span
          className="e1"
          onClick={(e) => onClickEmoji(e)}
          id="1f4bc"
          data-shortname=":briefcase:"
          data-index="225"
          title="briefcase"
          data-eid="592"
        >
          <span className="emojione emojione-1f4bc"></span>
        </span>
      </div>
    </div>
  );
};