SimplePopover
Extends React.Component
A simple popover element.
Parameters
-
props
object-
props.isPopoverVisible
boolean Determines if the popover is visible or not. -
props.setPopoverVisible
function The function to invoke to change the isPopoverVisible value. -
props.popoverMessage
string The text string to display in the popover. -
props.popoverStyle
object Extra css styles to apply to the popover. (optional, default{}
) -
props.popoverOrigin
string The direction that the popover message is displayed from. (optional, defaultright
) -
props.children
function The content to display which triggers a popover.
-
Examples
import React from "react"
import { connect } from "react-redux"
import { SimplePopover } from "@alexseitsinger/react-simple-popover"
const App = ({ isPopoverVisible, setPopoverVisible, ...props }) => {
return (
<SimplePopover
isPopoverVisible={isPopoverVisible}
setPopoverVisible={setPopoverVisible}
popoverMessage={"This is the text that gets displayed"}>
<div>This is the content that has a popover.</div>
</SimplePopover>
)
}
const mapDispatch = dispatch => ({
setPopoverVisible: bool => dispatch(setPopoverVisible(bool)),
})
const mapState = state => ({
isPopoverVisible: state.app.isPopoverVisible,
})
export default connect(mapState, mapDispatch)(App)
Returns function A component.