emoji mart showing hashtag emojis only

Question

The emoji mart picker is only showing hashtags when I change set to anything but native, im currently using it in react typescript.

<div className="picker">
  <AppComponent.EmojiPicker
    set="twitter"
    emojiButtonColors={["#364157"]}
    emojiButtonRadius="8px"
    skinTonePosition="search"         
  />
</div>

Here is the image of whats happening

import React, { useEffect, useRef } from "react";

import data from "@emoji-mart/data";
import { Picker, PickerProps } from "emoji-mart";

const EmojiPicker = (props: PickerProps | Readonly<PickerProps> | any) => {
    const ref = useRef() as React.MutableRefObject<HTMLInputElement>;

    useEffect(() => {
        new Picker({ ...props, data, ref });
    }, [props]);

    return <div ref={ref} />;
};

export default EmojiPicker;

Also I am unsure how to use the emoji component to display a single emoji, it would be much appreciated if you can help me with that too thanks a bunch!

Answer 1

@DSTitan have you found any reason for this?