be able to pick multiple emojis ; move up picker div to see emojis inputted into textfield; restore focus into textfield after picker closes; address #612 (#614)

webroot/js/components/chat/chat-input.js

@@ -68,6 +68,9 @@ export default class ChatInput extends Component {
           custom: json,
           initialCategory: 'custom',
           showPreview: false,
+          autoHide: false,
+          autoFocusSearch: false,
+          showAnimation: false,
           emojiSize: '24px',
           position: 'right-start',
           strategy: 'absolute',
@@ -75,6 +78,10 @@ export default class ChatInput extends Component {
         this.emojiPicker.on('emoji', emoji => {
           this.handleEmojiSelected(emoji);
         });
+        this.emojiPicker.on('hidden', () => {
+          this.formMessageInput.current.focus();
+          replaceCaret(this.formMessageInput.current);
+        });
       })
       .catch(error => {
         // this.handleNetworkingError(`Emoji Fetch: ${error}`);

webroot/styles/chat.css

@@ -81,6 +81,9 @@
 
 /******************************/
 /* EMOJI PICKER OVERRIDES */
+.emoji-picker__wrapper {
+  margin-top: -30px !important;
+}
 .emoji-picker.owncast {
   --secondary-text-color: rgba(255, 255, 255, 0.5);
   --category-button-color: rgba(255, 255, 255, 0.5);