Popover

Displays rich content in a portal, triggered by a button.
# Demo
# Attributes
NameTypeDefaultDetails
classNamestring' 'You can customise by passing tailwind classes.
triggerClassNamestring' 'You can customise by passing tailwind classes.
sizePopoverSizePopoverSize.MDYou can pass size of the popover.
sidetop | bottom | right | leftbottomYou can pass side to popover.
alignstart | end | centerendYou can pass align to popover.
triggerstring | ReactNodeRequiredYou can pass trigger to popover.
childrenstring | ReactNodeRequiredYou can pass popover content as children.
# Usage
import { NPopover, NButton, PopoverSize } from 'nayan'; const Popover = () => { return ( <NPopover size={PopoverSize.MD} trigger={<NButton>Show Popover</NButton>}> <div className="overflow-hidden p-3"> <div className="text-sm font-medium text-text">Documentation</div> <div className="text-sm text-muted">Start integrating products and tools</div> </div> </NPopover> ); }; export default Popover;