`DOMException` if selector contains unescaped quotes

[yeskunall]

If the value passed to Input contains unescaped quotes ('' or "") in them, then it results in a DOMException. I was able to trace it back to this line.

Reproduced the error in the browser console:

const ITEM_SELECTOR = `[cmdk-item=""]`;
const VALUE_ATTR = `data-value`;

const value = `canceling statement due to "statement timeout"-item-index-0`;

document.querySelector(`${ITEM_SELECTOR}[${VALUE_ATTR}="${value}"]`);

The error:

Uncaught DOMException: Failed to execute 'querySelector' on 'Document': '[cmdk-item=""][data-value="canceling statement due to "statement timeout"-item-index-0"]' is not a valid selector.

I actually ran into this error while browsing Supabase docs, where the above described issue can be replicated by searching for the following: “canceling statement due to statement timeout” (without the quotes) and then hovering over the first item returned in the results.

Should cmdk handle this or should the end-user be escaping the quotes themselves? IMO, given that the value is an internal state variable (not exposed to the end-user), cmdk should validate the selector somehow. But I might be missing something. Either way, thanks for taking a look at this, and LMK if you need further info.

PS: Thanks for such a great library! 💖

[LordZardeck]

@pacocoursey What's the timeline of getting this fix released? This is causing us issues in production. I noticed that this was fixed in 8aecf2d but hasn't been released yet