Skip to content

Latest commit

 

History

History
43 lines (32 loc) · 1.69 KB

README.md

File metadata and controls

43 lines (32 loc) · 1.69 KB

NPM Version

Lightweight Vue Emoji Picker Component

This repository is a fork of serebrov/emoji-mart-vue with the following changes:

  • complete rewrite in TypeScript
  • used Vue 3 <script setup> with Composition API and TypeScript
  • used composables and objects instead of classes
  • used Vite for development
  • removed unnecessary dependencies. The single dependency is vue.
  • optimized for bundle size (from 47 KB to 33 KB)
  • optimized JSON files (e.g. twitter.json is now 480 KB instead of 754 KB)
  • included only one emoji set (twemoji), which is the most popular. To reduce the total bundle size. You can easily download other sets from data folder.
  • improved keyboard navigation

live demo

Installation

npm install @mergehez/vue-emoji-picker
bun install @mergehez/vue-emoji-picker

Simple Usage

<script setup>
  import EmojiPicker, {useEmojiIndex} from '@mergehez/vue-emoji-picker';
  import emojiSet from '@mergehez/vue-emoji-picker/emoji-set.json';
  import '@mergehez/vue-emoji-picker/styles.css';

  const emojiIndex = useEmojiIndex(emojiSet);
  const emoji = ref('😀');
</script>

<template>
  <EmojiPicker v-model="emoji" :data="emojiIndex" />
</template>