This component allows you to highlight, with a preferred style, the searched words on your screen. It's a Client Action, with a JavaScript node, to be used OnRender of each screen and block where your target list will be.

This action has 2 inputs:

- ListID: should be used to input the Id of the List widget where your searched words can be found;

- Keywords: should be used to input the searched word(s) from your search input; this can be a single word, or a comma separated list of terms.

There are extra steps described inside the Client Action that we'll also leave here:

You will need to add to your theme a CSS class called "marked-text". This will be the class applied to the results of your search.

Example:

.marked-text {

background-color: #f0f067;

font-weight: bold;

} -> results in a bold font and yellow background for your search results

Also, to all the expressions you want it to be possible to highlight, add "highlight" to the Style Classes property. This is how the JavaScript will find the expression, use the word "highlight" as a tag, and apply the new styling.