{"id":21659082,"url":"https://github.com/xiewang/react-native-emoticons","last_synced_at":"2025-04-09T21:15:12.165Z","repository":{"id":50307450,"uuid":"89002282","full_name":"xiewang/react-native-emoticons","owner":"xiewang","description":"react native emoticons（表情）, including emoji😁","archived":false,"fork":false,"pushed_at":"2021-05-07T11:49:21.000Z","size":11988,"stargazers_count":127,"open_issues_count":23,"forks_count":74,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-04-09T21:15:06.242Z","etag":null,"topics":["chat","emoji","emoticon","emoticons","keyboard","react-native","storage"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xiewang.png","metadata":{"files":{"readme":"README.md","changelog":"history.png","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-21T16:14:41.000Z","updated_at":"2025-02-17T08:55:38.000Z","dependencies_parsed_at":"2022-08-31T08:11:44.673Z","dependency_job_id":null,"html_url":"https://github.com/xiewang/react-native-emoticons","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiewang%2Freact-native-emoticons","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiewang%2Freact-native-emoticons/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiewang%2Freact-native-emoticons/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xiewang%2Freact-native-emoticons/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xiewang","download_url":"https://codeload.github.com/xiewang/react-native-emoticons/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248111971,"owners_count":21049578,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chat","emoji","emoticon","emoticons","keyboard","react-native","storage"],"created_at":"2024-11-25T09:30:23.700Z","updated_at":"2025-04-09T21:15:12.141Z","avatar_url":"https://github.com/xiewang.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# React Native Emoticons\nreact native emoticons component, including emoji\n\n![emoticons](docs/emoticons.gif)\n\n### latest screenshot sample\n![emoticons](docs/sample2.png )\n\n\u003c!--![Markdown](http://i2.muimg.com/1949/cda818de0596cd04.gif)--\u003e\n## Install\n\n```js\nnpm install react-native-emoticons\n```\n\n## Usage\n\n### UI Component\n\n- step 1\n\n\tImport the component package.\n\t\n\t```js\n\timport Emoticons from 'react-native-emoticons';\n\t```\n- step 2\n\n\tWrite the component code in the proper place of your page render.\n\t\n\t```js\n\t\u003cEmoticons\n\t\t onEmoticonPress={this._onEmoticonPress.bind(this)}\n\t\t onBackspacePress={this._onBackspacePress.bind(this)}\n\t\t show={this.state.showEmoticons}\n\t\t concise={true}\n\t\t showHistoryBar={true}\n\t\t showPlusBar={true}\n     /\u003e\n\t```\n\t\u003e **Tip:**  The attribute `onEmoticonPress ` can get the emoticos results like `{code:'😁', name: 'GRIMACING FACE'}`. The attribute `show ` will control that if the component is visible.  The attribute `onBackspacePress ` will add a function for backspace button. \n\n### props\n\n| Prop | Type | Description | Required | Default |\n|---|---|---|---|---|\n|**`onEmoticonPress `**|`Function `| callback function when the emoticons is pressed |`Yes`|None|\n|**`onBackspacePress `**|`Function `| callback function when the backspace button is pressed |`YES`|None|\n|**`show `**|`Bool `| show the component |`YES`| false |\n|**`concise `**|`Bool `| concise mod with less emoji |`No`| true |\n|**`showHistoryBar `**|`Bool `| enable history function |`No`| true |\n|**`showPlusBar `**|`Bool `| enable more emoticons function(is on developing, if you have interesting on this, welcome pull request.)|`No`| true |\n|**`asyncRender `**|`Bool `| async render |`No`| false |\n\n### API\n\nImport\n\n```js\nimport * as emoticons from 'react-native-emoticons';\n```\n\n1. stringify\n\t\n\t```js\n\t//Most database can't restore the emoji string😤,so we map \n\t//them to common string.\n\t\n\tconst string = emoticons.stringify('This is source emoji 😁');\n\tconsole.log(string);\n\t```\n\t```js\n\t//output\n\t'This is source emoji [GRIMACING FACE]'\n\t```\n\t\n2. parse\n\n\t```js\n\t//If we want to show the emoji(fetch from database) in view page\n\t//we need parse the string\n\t\n\tconst emoji = emoticons.parse('This is source emoji [GRIMACING FACE]');\n\tconsole.log(emoji);\n\t```\n\t```js\n\t//output\n\t'This is source emoji 😁'\n\t```\n\n3. splitter\n\n\t```js\n\t//this api is for backspace function\n\tconst emoji = emoticons.splitter('emoji😁');\n\tconsole.log(emoji);\n\t```\n\t```js\n\t//output\n\t['e','m','o','j','i','😁']\n\t```\n\n\n## Further\n\t\n###\tSupport custom emoticons like `weixin`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxiewang%2Freact-native-emoticons","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxiewang%2Freact-native-emoticons","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxiewang%2Freact-native-emoticons/lists"}