{"action":"created","issue":{"url":"https://api.github.com/repos/bvaughn/react-highlight-words/issues/70","repository_url":"https://api.github.com/repos/bvaughn/react-highlight-words","labels_url":"https://api.github.com/repos/bvaughn/react-highlight-words/issues/70/labels{/name}","comments_url":"https://api.github.com/repos/bvaughn/react-highlight-words/issues/70/comments","events_url":"https://api.github.com/repos/bvaughn/react-highlight-words/issues/70/events","html_url":"https://github.com/bvaughn/react-highlight-words/pull/70","id":393162550,"node_id":"MDExOlB1bGxSZXF1ZXN0MjQwMjYyOTIy","number":70,"title":"Expose chunk, chunkIndex, and highlightIndex to highlightTag render prop","user":{"login":"pkmoran","id":14882519,"node_id":"MDQ6VXNlcjE0ODgyNTE5","avatar_url":"https://avatars3.githubusercontent.com/u/14882519?v=4","gravatar_id":"","url":"https://api.github.com/users/pkmoran","html_url":"https://github.com/pkmoran","followers_url":"https://api.github.com/users/pkmoran/followers","following_url":"https://api.github.com/users/pkmoran/following{/other_user}","gists_url":"https://api.github.com/users/pkmoran/gists{/gist_id}","starred_url":"https://api.github.com/users/pkmoran/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pkmoran/subscriptions","organizations_url":"https://api.github.com/users/pkmoran/orgs","repos_url":"https://api.github.com/users/pkmoran/repos","events_url":"https://api.github.com/users/pkmoran/events{/privacy}","received_events_url":"https://api.github.com/users/pkmoran/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":9,"created_at":"2018-12-20T18:29:51Z","updated_at":"2018-12-29T02:35:13Z","closed_at":"2018-12-29T00:24:34Z","author_association":"NONE","pull_request":{"url":"https://api.github.com/repos/bvaughn/react-highlight-words/pulls/70","html_url":"https://github.com/bvaughn/react-highlight-words/pull/70","diff_url":"https://github.com/bvaughn/react-highlight-words/pull/70.diff","patch_url":"https://github.com/bvaughn/react-highlight-words/pull/70.patch"},"body":"This change exposes the `chunk`, `index as chunkIndex`, and `highlightCount as highlightIndex` to the `HighlightTag` render prop. This is useful if a user would like to apply custom styling/colors to the chunks. It could be used like this for example:\r\n\r\n```js\r\nconst getHighlightTag = () => ({ children, highlightIndex }) => {\r\n    const backgroundColors: {\r\n        0: 'green',\r\n        1: 'red',\r\n        2: 'blue\r\n    }\r\n\r\n    return (\r\n        <mark backgroundColor={backgroundColors[highlightIndex]}>\r\n            {children}\r\n        </mark>\r\n    );\r\n};\r\n\r\n\r\n<Highlighter\r\n    highlightTag={getHighlightTag()}\r\n    searchWords={[ 'hello', 'highlight', 'text' ]}\r\n    textToHighlight={'hello, highlight this text'}\r\n/>\r\n```\r\n\r\nThe `chunk` and `chunkIndex` props are not necessary for the above example, but I thought they may be useful for someone"},"comment":{"url":"https://api.github.com/repos/bvaughn/react-highlight-words/issues/comments/450458403","html_url":"https://github.com/bvaughn/react-highlight-words/pull/70#issuecomment-450458403","issue_url":"https://api.github.com/repos/bvaughn/react-highlight-words/issues/70","id":450458403,"node_id":"MDEyOklzc3VlQ29tbWVudDQ1MDQ1ODQwMw==","user":{"login":"bvaughn","id":29597,"node_id":"MDQ6VXNlcjI5NTk3","avatar_url":"https://avatars0.githubusercontent.com/u/29597?v=4","gravatar_id":"","url":"https://api.github.com/users/bvaughn","html_url":"https://github.com/bvaughn","followers_url":"https://api.github.com/users/bvaughn/followers","following_url":"https://api.github.com/users/bvaughn/following{/other_user}","gists_url":"https://api.github.com/users/bvaughn/gists{/gist_id}","starred_url":"https://api.github.com/users/bvaughn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bvaughn/subscriptions","organizations_url":"https://api.github.com/users/bvaughn/orgs","repos_url":"https://api.github.com/users/bvaughn/repos","events_url":"https://api.github.com/users/bvaughn/events{/privacy}","received_events_url":"https://api.github.com/users/bvaughn/received_events","type":"User","site_admin":false},"created_at":"2018-12-29T02:35:13Z","updated_at":"2018-12-29T02:35:13Z","author_association":"OWNER","body":"My pleasure\n\nOn Fri, Dec 28, 2018, 6:00 PM Scott Montminy <notifications@github.com\nwrote:\n\n> Thanks @bvaughn <https://github.com/bvaughn> for working through this one\n> with us.\n>\n> —\n> You are receiving this because you were mentioned.\n> Reply to this email directly, view it on GitHub\n> <https://github.com/bvaughn/react-highlight-words/pull/70#issuecomment-450454663>,\n> or mute the thread\n> <https://github.com/notifications/unsubscribe-auth/AABznZG-6U0_bq6QdfUpeuhK_2QSSU7pks5u9szRgaJpZM4Zcsr9>\n> .\n>\n"}}
{"actor":{"display_login":"bvaughn"}}