vue3-discordpicker
vue3-discord-picker
A new emoji / gif picker for your app ! Based on discord.
This components is available only in vue3.
🚧 Rework in typescript and composition-api soon.
Example
Install
npm install vue3-discordpicker
Global
import Vue from 'vue'
import DiscordPicker from 'vue3-discordpicker'
Vue.use(DiscordPicker, /* { default options with global component } */)
Local registration
import DiscordPicker from 'vue3-discordpicker'
export default {
components: {
DiscordPicker
}
}
Props
| Name | Type | Default | Description |
|---|---|---|---|
| input | Boolean |
false | Load input w/ autocomplete |
| value | String, Number |
null | v-model to input value |
| categories | Array |
true | Display the mask on first load |
| gifFormat | String |
Return gif link with markdown format or html format (default: nothing) | |
| apiKey | String |
API_KEY tenor.com (free, register here: https://tenor.com/gifapi) (if no key: gif not appear) | |
| showUpload | Boolean |
Display upload icon at left (with emit method) | |
| showEmoji | Boolean |
Display emoji icon | |
| sources | Object |
Set new source url for all image |
Sources props
"search": String
"gif": String
"emoji": String
"category": String (add %REPLACE% in your URL to change with slug, example: https://en-zo.dev/vue-discord-emojipicker/categories/%REPLACE%.svg transform into https://en-zo.dev/vue-discord-emojipicker/categories/animals.svg) "variation": String(same at category, example:https://en-zo.dev/vue-discord-emojipicker/variations/variation_%REPLACE%.svgtransform intohttps://en-zo.dev/vue-discord-emojipicker/variations/variation_0.svg` (0 - 4))
Categories
All categories list:
['people', 'animals', 'foods', 'travel', 'activities', 'objects', 'symbols', 'flags']
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 1.1.0 | ^3.0.0 | ||
| 1.0.7 | ^3.0.0 | ||
| 1.0.6 | ^3.0.0 | ||
| 1.0.5 | ^3.0.0 | ||
| 1.0.4 | ^3.0.0 | ||
| 1.0.3 | ^3.0.0 | ||
| 1.0.2 | ^3.0.0 | ||
| 1.0.1 | ^3.0.0 | ||
| 1.0.0 | ^3.0.0 |