Uncaught TypeError with example component and React 18.18.2
mcadotsch opened this issue · 3 comments
Hi, i am facing an issue using react-cmdk with React 18.18.2. I get the following error in the browser console:
Uncaught TypeError: Cannot read properties of undefined (reading 'Child')
at CommandPalette (CommandPalette.tsx:162:1)
at renderWithHooks (react-dom.development.js:16305:1)
at mountIndeterminateComponent (react-dom.development.js:20074:1)
at beginWork (react-dom.development.js:21587:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
at invokeGuardedCallback (react-dom.development.js:4277:1)
at beginWork$1 (react-dom.development.js:27451:1)
at performUnitOfWork (react-dom.development.js:26557:1)
at workLoopSync (react-dom.development.js:26466:1)
That's how my simple component looks like:
import "react-cmdk/dist/cmdk.css";
import CommandPalette from "react-cmdk";
import { useState } from "react";
const Cmdk = () => {
const [isOpen, setIsOpen] = useState(false);
const [search, setSearch] = useState("");
return (
<>
<CommandPalette
onChangeSearch={setSearch}
onChangeOpen={setIsOpen}
search={search}
isOpen={isOpen}
children=""
>
<CommandPalette.List heading="General">
<CommandPalette.ListItem
children="Home"
icon="HomeIcon"
index={0}
/>
</CommandPalette.List>
</CommandPalette>
</>
);
};
export default Cmdk;
What am i doing wrong?
You have children=""
on CommandPalette
. Try removing that prop.
same issue with no children prop passed. seems to be coming from headless ui
Same issue here react 18. I just tried the example code verbatim.