Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | 19x 19x 19x | import React, { Children, PropsWithChildren, ReactElement } from "react"; import TextHighlighter from "components/TextHighlighter"; import { extractTextFromChildren } from "utils"; export default function Searchable({ searchTerm, children, }: PropsWithChildren<{ searchTerm: string }>): ReactElement { return ( <> {Children.map(children, (child) => { const text = extractTextFromChildren(child); Iif (!searchTerm) return child; Iif ( searchTerm && text && text.toLowerCase().includes(searchTerm.toLowerCase()) ) { return <TextHighlighter text={searchTerm}>{child}</TextHighlighter>; } return null; })} </> ); } |