/** * @license * Copyright Akveo. All Rights Reserved. * Licensed under the MIT License. See License.txt in the project root for license information. */ import { AfterViewInit, ComponentFactoryResolver, ComponentRef, ElementRef, OnDestroy } from '@angular/core'; import { NbAdjustableConnectedPositionStrategy, NbAdjustment, NbOverlayContent, NbOverlayRef, NbOverlayService, NbPosition, NbPositionBuilderService, NbTrigger, NbTriggerStrategy } from '../cdk'; /** * Powerful popover directive, which provides the best UX for your users. * * @stacked-example(Showcase, popover/popover-showcase.component) * * Popover can accept different content such as: * TemplateRef * * ```html * * * Hello, Popover! * * ``` * ### Installation * * Import `NbPopoverModule` to your feature module. * ```ts * @NgModule({ * imports: [ * // ... * NbPopoverModule, * ], * }) * export class PageModule { } * ``` * ### Usage * * Custom components * * ```html * * ``` * * Both custom components and templateRef popovers can receive *contentContext* property * that will be passed to the content props. * * Primitive types * * ```html * * ``` * * Popover has different placements, such as: top, bottom, left, right, start and end * which can be used as following: * * @stacked-example(Placements, popover/popover-placements.component) * * By default popover will try to adjust itself to maximally fit viewport * and provide the best user experience. It will try to change position of the popover container. * If you wanna disable this behaviour just set it falsy value. * * ```html * * ``` * * Also popover has some different modes which provides capability show$ and hide$ popover in different ways: * * - Click mode popover shows when a user clicking on the host element and hides when the user clicks * somewhere on the document except popover. * - Hint mode provides capability show$ popover when the user hovers on the host element * and hide$ popover when user hovers out of the host. * - Hover mode works like hint mode with one exception - when the user moves mouse from host element to * the container element popover will not be hidden. * * @stacked-example(Available Modes, popover/popover-modes.component.html) * * @additional-example(Template Ref, popover/popover-template-ref.component) * @additional-example(Custom Component, popover/popover-custom-component.component) * */ export declare class NbPopoverDirective implements AfterViewInit, OnDestroy { protected document: any; private hostRef; private positionBuilder; private overlay; private componentFactoryResolver; /** * Popover content which will be rendered in NbArrowedOverlayContainerComponent. * Available content: template ref, component and any primitive. * */ content: NbOverlayContent; /** * Container content context. Will be applied to the rendered component. * */ context: Object; /** * Position will be calculated relatively host element based on the position. * Can be top, right, bottom, left, start or end. * */ position: NbPosition; /** * Container position will be changes automatically based on this strategy if container can't fit view port. * Set this property to any falsy value if you want to disable automatically adjustment. * Available values: clockwise, counterclockwise. * */ adjustment: NbAdjustment; /** * Describes when the container will be shown. * Available options: click, hover and hint * */ mode: NbTrigger; protected ref: NbOverlayRef; protected container: ComponentRef; protected positionStrategy: NbAdjustableConnectedPositionStrategy; protected triggerStrategy: NbTriggerStrategy; protected alive: boolean; constructor(document: any, hostRef: ElementRef, positionBuilder: NbPositionBuilderService, overlay: NbOverlayService, componentFactoryResolver: ComponentFactoryResolver); ngAfterViewInit(): void; ngOnDestroy(): void; show(): void; hide(): void; toggle(): void; protected createPositionStrategy(): NbAdjustableConnectedPositionStrategy; protected createTriggerStrategy(): NbTriggerStrategy; protected subscribeOnPositionChange(): void; protected subscribeOnTriggers(): void; }