Update preview default state

css/emoji-picker.css

@@ -102,3 +102,18 @@
 .emoji-picker-preview-shortname + .emoji-picker-preview-shortname {
   margin-left: .5em;
 }
+
+.emoji-picker-title span {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.emoji-picker-title .emoji-picker-emoji {
+  padding: 0;
+}
+
+.emoji-picker-title-label {
+  font-size: 26px;
+  font-weight: 500;
+  margin-left: .4em;
+}

src/components/preview.js

@@ -31,8 +31,16 @@ export default class Preview extends React.Component {
         </div>
       </div>
     } else {
-      return <div>
+      return <div className='emoji-picker-title'>
-        EmojiPicker
+        <Emoji
+          {...emojiProps}
+          emoji='tophat'
+          size={46}
+        />
+
+        <span className='emoji-picker-title-label'>
+          EmojiPicker
+        </span>
       </div>
     }
   }