CommandItem value with special characters not escaped/removed throws a SyntaxError

A runtime SyntaxError is thrown by querySelector() that causes the React component tree to crash when the value or fallback textContent contains special characters. We discovered this when pen testers created a resource with a value of <a href="javascript:alert(1)">Click Me!</a> that when hovered crashed our app.

Rendering of the CommandItem on the DOM works as expected, as JSX escapes characters. However, when the CommandItem is hovered, document.querySelector('[data-value="..."]') causes a runtime error. This is because the data-value attribute is being set to an unescaped string.

I addressed this within our implementation by sanitizing the value prop with CSS.escape(value), or with a regex fallback, if the CSS object isn't available, replacing special characters with an empty string.

I believe this escapement should be addressed by the library, if possible. Thank you.

https://github.com/user-attachments/assets/ebeb5b0f-427e-464a-ab79-32ac02152388