Developer FeaturePopover
This is a wrap component, which is completely inherited from <Popper/>.
jsx
import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover />;import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover />;PopperProps
& & & Omit<"placement"> & {...}| 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"] | |
| disableEnforceFocus | boolean | Disabled focus trap, autofocus and focus return |
FeaturePopover.Trigger
This is the element, to which <FeaturePopover.Popper/> will be attached. It is fully inherited from <Popper.Trigger/>.
jsx
import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover.Trigger />;import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover.Trigger />;PopperTriggerProps
& {...}FeaturePopover.Popper
This is the element, to which <FeaturePopover.Trigger/> will be attached. It is fully inherited from <Popper.Popper/>.
jsx
import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover.Popper />;import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover.Popper />;FeaturePopoverPopperProps
& {...}| Name | Type | Description |
|---|---|---|
| closeIcon | boolean | The property responsible for the visibility of the closing icon |
| duration | number | Animation display duration in `ms` |
| locale | string |
FeaturePopover.Spot
This blinking circle is inherited from <Box>.
jsx
import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover.Spot />;import FeaturePopover from '@semcore/ui/feature-popover';
<FeaturePopover.Spot />;