An emoji mixin for React
Available items
No Items, yet!
The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:
Readme
react-emoji
An emoji mixin for React
Features
Compatible React Versions
[email protected] and [email protected] both can be used <= [email protected]
However, test code depends on [email protected], it's internal though.
Demo
Install
npm i react-emoji # or bower i react-emoji # `window.ReactEmoji` is available
Usage
let App = React.createClass({
getDefaultProps() {
return {
text: "foo bar :100: :)",
};
},
mixins: [
ReactEmoji
],
render() {
return (
{ this.emojify(this.props.text) }
{ ReactEmoji.emojify(this.props.text) } // or can be used no mixin way
);
}
});
API
emojify(text, options)
Default options
All options are optional.
Properties |
Description | Default | Type |
|---|---|---|---|
| useEmoticon | Use emoticon or not | true | Boolean |
| emojiType | twemoji or emojione are available | twemoji | String |
| host | Custom host | "" | String |
| path | Custom path | "" | String |
| ext | asset ext. svg or png are available | svg | String |
| attributes | Attributes such as className or onClick | {width: '20px', height: '20px'} | Object |
| singleEmoji | Show single emoji (either of annotation or emoticon), use this option if input is limited to render single emoji, this is slightly faster | false | Boolean |
| strict | Throw an error if annotation is not in dict, it's handy if emoji input is not from end user | false | Boolean |
Tips
In tandem with react-autolink.
Development
Dependency
$ npm i
Run
$ npm start # => http://0.0.0.0:8080
Test
$ npm test
License
MIT