Skip to content

Getting warning with <Popover /> component #44

@Lesleyvdp

Description

@Lesleyvdp

I'm using the Popover component the way it is described by the documentation except it is throwing a warning in the console.

The warning:

Warning: Invalid value for prop toggle on

tag. Either remove it from the element, or pass a string or number value to keep it in the DOM. For details, see https://reactjs.org/link/attribute-behavior
at div
at div
at InnerPopper (webpack-internal:///./node_modules/react-popper/lib/esm/Popper.js:52:35)
at Popper (webpack-internal:///./node_modules/react-popper/lib/esm/Popper.js:216:31)
at div
at PopperManager (webpack-internal:///./node_modules/shards-react/dist/shards-react.es.js:5626:5)
at Popover (webpack-internal:///./node_modules/shards-react/dist/shards-react.es.js:5857:5)
at InformationPopover (webpack-internal:///./components/Navbar/InformationPopover/InformationPopover.tsx:17:21)

The code I'm using:

<>
    <Button id="nav-toggle-popover" onClick={togglePopover}>
      Info
    </Button>
    <Popover placement="bottom" target="#nav-toggle-popover" toggle={togglePopover} open={isOpen}>
        <PopoverHeader>Information</PopoverHeader>
        <PopoverBody>How the app works</PopoverBody>
    </Popover>
</>

react version: 17.0.1
react-dom version: 17.0.1
shards-react version: 1.0.3

Note:
Everything does work the way it's supposed to, except I wouldn't expect a warning to be thrown.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions