Fix search highlighting conflict with jsx code (#1886)

Replaces "<>", "</>" highlighting marks with "<|[[--" and "--]]|>" to avoid conflicts when highlighting jsx code.
This commit is contained in:
Sebastian Sdorra
2021-12-06 16:49:31 +01:00
committed by GitHub
parent e4936260a1
commit ad5bbfeef3
5 changed files with 13 additions and 9 deletions

View File

@@ -24,6 +24,9 @@
import React, { FC } from "react";
const PRE_TAG = "<|[[--";
const POST_TAG = "--]]|>";
type Props = {
value: string;
};
@@ -33,14 +36,14 @@ const HighlightedFragment: FC<Props> = ({ value }) => {
const result = [];
while (content.length > 0) {
const start = content.indexOf("<>");
const end = content.indexOf("</>");
const start = content.indexOf(PRE_TAG);
const end = content.indexOf(POST_TAG);
if (start >= 0 && end > 0) {
if (start > 0) {
result.push(content.substring(0, start));
}
result.push(<strong>{content.substring(start + 2, end)}</strong>);
content = content.substring(end + 3);
result.push(<strong>{content.substring(start + PRE_TAG.length, end)}</strong>);
content = content.substring(end + POST_TAG.length);
} else {
result.push(content);
break;