chayns-emoji-picker is a fully-featured and accessible emoji-picker for chayns® applications. It is built and meant to be used with React.

❯ Get Started

First off, install the package:

# Yarn
yarn add chayns-emoji-picker

# NPM
npm install chayns-emoji-picker

Now, you can import the <EmojiPicker> component into your components:

import React, { ReactElement } from 'react';
import { EmojiPicker } from 'chayns-emoji-picker';

export function MyComponent() {
    const [showEmojiPicker, setShowEmojiPicker] = useState(false);

    function handleOpenEmojiPicker() {
        setShowEmojiPicker(true);
    }

    function handleCloseEmojiPicker() {
        setShowEmojiPicker(false);
    }

    return (
        <button
            style={{ position: 'relative' }}
            onClick={handleOpenEmojiPicker}
        >
            Show Emoji-Picker
            <EmojiPicker
                show={showEmojiPicker}
                onHide={handleCloseEmojiPicker}
            />
        </button>
    );
}

For a full reference and documentation of all props, visit the docs.

❯ Documentation

Visit tobitsoftware.github.io/chayns-emoji-picker/ to read the full documentation.

❯ Contributing

You can find information about contributing to the project in our CONTRIBUTING.md document.