@yosefbeder/react-emojis v0.1.0

React Emoji Picker

A simple and useful emoji-picker without much configurations 😎.

You can try to play with the configurations from this Demo Project.

Installation

You can install it with either

npm install @yosefbeder/react-emoji-picker

or

yarn add @yosefbeder/react-emoji-picker

Usage

To start using the component you shouldn't add any configs except onEmojiClick.

Most of the configs focuses on customizing the way it looks (You can play with then from here).

import React from 'react';
import EmojiPicker from '@yosefbeder/react-emoji-picker';

const App = () => {
	const [emoji, setEmoji] = useState('');

	return (
		<div>
			<EmojiPicker onEmojiClick={emojiObj => setEmoji(emojiObj.emoji)} />
		</div>
	);
};

Configurations

Types

type Theme = 'light' | 'dark';

type Size = 'sm' | 'med' | 'lg';

type Category =
	| 'recently-used'
	| 'smileys_people'
	| 'animals_nature'
	| 'food_drink'
	| 'travel_places'
	| 'activities'
	| 'objects'
	| 'symbols'
	| 'flags';

interface EmojiObj {
	emoji: string;
	name: string;
	skinTone: number;
}

Props

Notes

• This component library depends on the rem unit so please don't change the font size of the root element in your app or the sizes will be broken.
• If you find any bug send me and email from here.
• This is an open-source library you can help me improving it or just see the code from here.
• This is my third real project with react so it may not be so good, but I've done my best over the last week to make it like this if you want to see my other projects check my github account from here.

License

MIT License

Copyright (c) 2021 yosefbeder