Skip to content

Popper

Popper

This is a wrapper for creating a context, which doesn't create additional nodes in the house.

jsx
import Popper from 'intergalactic/popper';
<Popper />;
import Popper from 'intergalactic/popper';
<Popper />;

PopperProps

& & & & {...}
NameTypeDescription
strategyPopper can have different positioning options
modifiersModifiers for popper.js
placementThe position of the popper relative to the trigger that called it. 'auto-start' | 'auto' | 'auto-end' | 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-end' | 'bottom' | 'bottom-start' | 'left-end' | 'left' | 'left-start'
interaction"click" | "hover" | "focus" | "none" | Interaction with a trigger to show and hide the popper
timeoutnumber | [number, number]Timer to show and hide the popper
visiblebooleanPopper visibility value
defaultVisiblebooleanDefault popper visibility
onVisibleChange(visible: boolean, e: ) => boolean | voidFunction called when visibility changes
offsetPartial<> | number | [number, number]PopperJS modifier settings for popper indent
preventOverflowPartial<>PopperJS modifier settings for finding borders
arrowPartial<>PopperJS modifier settings responsible for the arrow
flipPartial<>PopperJS modifier settings responsible for turning the popper when there is not enough space
computeStylesPartial<>PopperJS modifier settings for applying styles
eventListenersPartial<>PopperJS modifier settings responsible for subscribing to global events
onFirstUpdate["onFirstUpdate"]
disabledbooleanFlag for disable Popover (if true, it will close Popper and it will not respond to handlers)
disableEnforceFocusbooleanDisabled focus trap, autofocus and focus return
focusLoopboolean

Popper.Trigger

The element to which <Popper.Popper/> will be attached.

jsx
import Popper from 'intergalactic/popper';
<Popper.Trigger />;
import Popper from 'intergalactic/popper';
<Popper.Trigger />;

PopperTriggerProps

& {...}
NameTypeDescription
disableEnforceFocusbooleanDisabled focus trap, autofocus and focus return

Popper.Popper

The element which will be attached to <Popper.Trigger/>.

jsx
import Popper from 'intergalactic/popper';
<Popper.Popper />;
import Popper from 'intergalactic/popper';
<Popper.Popper />;

PopperPopperProps

& & & {...}
NameTypeDescription
disableEnforceFocusbooleanDisabled focus trap, autofocus and focus return

Released under the MIT License.

Released under the MIT License.