Skip to main content

Chatroom Highlighter

Overview​

The Highlighter component is designed to highlight specific text within a larger body of text. It takes in a string of text and a list of keywords, dynamically rendering the keywords in a highlighted format while keeping the surrounding text in a normal style. This is particularly useful for enhancing readability and drawing attention to important terms or phrases in chat or document contexts.

GitHub File:

LMFeedMediaPreviewScreen

Customisation​

The highlighter can be customised by setting searchedHighlightedTextStyle and searchedNonHighlightedTextStyle through the setSearchInChatroomStyle method on the STYLES class

Usage Example​

  • Call the setSearchInChatroomStyle method on the STYLES class to set styling customisations.
import {STYLES} from "@likeminds.community/chat-rn-core"

STYLES.setSearchInChatroomStyle({
  searchedHighlightedTextStyle: {
    color: 'green'
  },
  searchedNonHighlightedTextStyle: {
    color: 'black'
  }
})