import { EventEmitter } from '../../stencil-public-runtime'; import { type Placement, type Strategy } from '@floating-ui/dom'; /** * @slot trigger - Content to be placed as the trigger. * @slot content - Content to be placed within the popover. */ export declare class NvPopover { el: HTMLNvPopoverElement; private popoverElement; private arrowElement; private eventsAttached; private boundTriggerElement; private animationGeneration; private clickEvents; private hideTimeout; private showTimeout; private hoverEvents; private closeEvents; /****************************************************************************/ /** * @internal * Accepts a reference to the DOM element acting as the popover trigger. This * should be used when the slot for the trigger is not defined. */ triggerElement: Element | ChildNode; /** * Use this prop to toggle the visibility of the popover. Set to true to show * the popover and false to hide it. */ open: boolean; /** * Sets the interaction mode for triggering the popover. Options include: * - `hover`: The popover is shown on trigger hover. * - `click`: The popover toggles on trigger click. * - `controlled`: The visibility is managed manually through methods or the * open prop. */ readonly triggerMode: 'hover' | 'click' | 'controlled'; /** * Defines where the popover appears relative to the trigger. */ readonly placement: Placement; /** * Sets the positioning strategy for the popover. Options include: * - `absolute`: Positions the popover relative to the trigger element * (default). * - `fixed`: Positions the popover relative to the viewport, useful when you * need the popover to break out of overflow hidden containers, it will not * scroll inside a scroll container due to the fixed positioning. */ readonly strategy: Strategy; /** * Use this to group popovers together so that opening one will not animate * the closing of another. This is helpful when popovers are placed close * together, preventing animation overlap. */ readonly groupName: string; /** * Adjust the gap between the popover and its trigger element by setting how * many pixels they should be apart. */ readonly offset: number; /** * Use this to decide if the popover should include a small arrow pointing to * the trigger element, making the connection between them more clear. */ readonly hasArrow: boolean; /** * Disables the automatic flipping of the popover when the trigger element is * out of the viewport. The popover will flip automatically by default. */ readonly disableFlip: boolean; /** * Sets how many pixels the popover should stay from the edge of the viewport. */ readonly shiftPadding: number; /** * Use this to set a delay before the popover appears on hover. If the mouse * leaves before this time, the popover won't show. This only works when the * trigger mode is set to `hover`. */ readonly enterDelay: number; /** * Use this to set the popover to be nested inside another popover. This will * prevent the parent popover from closing when the child popover is opened. */ readonly nested: boolean; /****************************************************************************/ /** * Call this method to show the popover, making it visible on the screen. */ show(): Promise; /** * Use this method to hide the popover, making it disappear from view. */ hide(): Promise; /** * Call this method to toggle between showing and hiding the popover, based on * its current state. */ toggle(): Promise; /** * Attaches the document-level listeners once, and (re)binds the * trigger-bound ones to whichever node is currently the trigger. Only the * document listeners are latched - trigger binding is re-synced on every * call, because the trigger node can be replaced at any time. */ private attachEventListeners; /** * Moves the trigger-bound listeners onto the current trigger element. * * The trigger is a node the popover does not own: a consumer, or a framework * renderer, can replace it at any time. Blazor does exactly that when it * re-renders a cell whose contents changed shape - the popover element * survives, the node it was listening to is detached. Binding once and never * looking again leaves the popover listening to a node that is no longer in * the document, so hover and click stop reaching it: the popover either never * opens again, or stays open because its `mouseleave` can no longer fire. * * Tracks the node the listeners are actually on, rather than a boolean, so a * swap can be detected and followed. */ private syncTriggerListeners; /** * Handles the click outside event. * @param {Event} event - The event object. */ private handleClickOutside; /** * Calculates the position of the popover relative to the trigger. * @docs https://floating-ui.com/docs/computePosition */ private positionPopover; /****************************************************************************/ private outsideClickEvents; /****************************************************************************/ /** * Emitted when the popover is toggled. * @bind open */ openChanged: EventEmitter; /****************************************************************************/ handleOpenChange(open: boolean): Promise; handleTriggerElementChange(): void; handleStrategyChange(): void; /****************************************************************************/ componentWillRender(): void; componentDidLoad(): void; disconnectedCallback(): void; /****************************************************************************/ render(): any; }