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 />;
PopperProps
& & & & {...}Name | Type | Description |
---|---|---|
strategy | Popper can have different positioning options | |
modifiers | Modifiers for popper.js | |
placement | The 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 |
timeout | number | [number, number] | Timer to show and hide the popper |
visible | boolean | Popper visibility value |
defaultVisible | boolean | Default popper visibility |
onVisibleChange | (visible: boolean, e: ) => boolean | void | Function called when visibility changes |
offset | Partial<> | number | [number, number] | PopperJS modifier settings for popper indent |
preventOverflow | Partial<> | PopperJS modifier settings for finding borders |
arrow | Partial<> | PopperJS modifier settings responsible for the arrow |
flip | Partial<> | PopperJS modifier settings responsible for turning the popper when there is not enough space |
computeStyles | Partial<> | PopperJS modifier settings for applying styles |
eventListeners | Partial<> | PopperJS modifier settings responsible for subscribing to global events |
onFirstUpdate | ["onFirstUpdate"] | |
disabled | boolean | Flag for disable Popover (if true, it will close Popper and it will not respond to handlers) |
disableEnforceFocus | boolean | Disabled focus trap, autofocus and focus return |
focusLoop | boolean | |
explicitTriggerSet | boolean | If enabled, you will need to use setTrigger function from children rendering function to set popper trigger. |
cursorAnchoring | boolean | If set, popper will be placed near the place mouse cursor entered the trigger |
Popper.Trigger
The element to which <Popper.Popper/>
will be attached.
jsx
import Popper from 'intergalactic/popper';
<Popper.Trigger />;
PopperTriggerProps
& {...}Name | Type | Description |
---|---|---|
disableEnforceFocus | boolean | Disabled 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 />;
PopperPopperProps
& & & {...}Name | Type | Description |
---|---|---|
disableEnforceFocus | boolean | Disabled focus trap, autofocus and focus return |