fix: safely escape strings passed to RegExp in InputSearch

washingtonpost · Dec 11, 2024 · 66fc814 · 66fc814
1 parent 0cb0ae6
commit 66fc814
Showing 1 changed file with 8 additions and 3 deletions.
diff --git a/packages/kit/src/input-search/InputSearchListItem.tsx b/packages/kit/src/input-search/InputSearchListItem.tsx
@@ -85,10 +85,15 @@ export const ListItem = ({ item, state }: ListItemProps) => {
   );
 
   let highlighted;
+
+  const escape = (string) => {
+    return string.replace(/[.*+\-?^${}()|[\]\\]/g, "\\$&");
+  };
+
   if (typeof item.rendered === "string") {
-    highlighted = item.rendered.replace(
-      new RegExp((state as ComboBoxState<object>).inputValue, "gi"),
-      (match) => (match ? `<mark>${match}</mark>` : "")
+    const val = escape((state as ComboBoxState<object>).inputValue);
+    highlighted = item.rendered.replace(new RegExp(val, "gi"), (match) =>
+      match ? `<mark>${match}</mark>` : ""
     );
   }