UNPKG

3.56 kBJavaScriptView Raw
1import { Directive, Input, Output, Renderer, ElementRef, ViewContainerRef } from '@angular/core';
2import { PopoverConfig } from './popover.config';
3import { ComponentLoaderFactory } from '../component-loader';
4import { PopoverContainerComponent } from './popover-container.component';
5/**
6 * A lightweight, extensible directive for fancy popover creation.
7 */
8export var PopoverDirective = (function () {
9 function PopoverDirective(_elementRef, _renderer, _viewContainerRef, _config, cis) {
10 this._popover = cis
11 .createLoader(_elementRef, _viewContainerRef, _renderer)
12 .provide({ provide: PopoverConfig, useValue: _config });
13 Object.assign(this, _config);
14 this.onShown = this._popover.onShown;
15 this.onHidden = this._popover.onHidden;
16 }
17 Object.defineProperty(PopoverDirective.prototype, "isOpen", {
18 /**
19 * Returns whether or not the popover is currently being shown
20 */
21 get: function () { return this._popover.isShown; },
22 set: function (value) {
23 if (value) {
24 this.show();
25 }
26 else {
27 this.hide();
28 }
29 },
30 enumerable: true,
31 configurable: true
32 });
33 /**
34 * Opens an element’s popover. This is considered a “manual” triggering of
35 * the popover.
36 */
37 PopoverDirective.prototype.show = function () {
38 if (this._popover.isShown) {
39 return;
40 }
41 this._popover
42 .attach(PopoverContainerComponent)
43 .to(this.container)
44 .position({ attachment: this.placement })
45 .show({
46 content: this.popover,
47 placement: this.placement,
48 title: this.popoverTitle
49 });
50 this.isOpen = true;
51 };
52 /**
53 * Closes an element’s popover. This is considered a “manual” triggering of
54 * the popover.
55 */
56 PopoverDirective.prototype.hide = function () {
57 if (this.isOpen) {
58 this._popover.hide();
59 this.isOpen = false;
60 }
61 };
62 /**
63 * Toggles an element’s popover. This is considered a “manual” triggering of
64 * the popover.
65 */
66 PopoverDirective.prototype.toggle = function () {
67 if (this.isOpen) {
68 return this.hide();
69 }
70 this.show();
71 };
72 PopoverDirective.prototype.ngOnInit = function () {
73 var _this = this;
74 this._popover.listen({
75 triggers: this.triggers,
76 show: function () { return _this.show(); }
77 });
78 };
79 PopoverDirective.prototype.ngOnDestroy = function () {
80 this._popover.dispose();
81 };
82 PopoverDirective.decorators = [
83 { type: Directive, args: [{ selector: '[popover]', exportAs: 'bs-popover' },] },
84 ];
85 /** @nocollapse */
86 PopoverDirective.ctorParameters = function () { return [
87 { type: ElementRef, },
88 { type: Renderer, },
89 { type: ViewContainerRef, },
90 { type: PopoverConfig, },
91 { type: ComponentLoaderFactory, },
92 ]; };
93 PopoverDirective.propDecorators = {
94 'popover': [{ type: Input },],
95 'popoverTitle': [{ type: Input },],
96 'placement': [{ type: Input },],
97 'triggers': [{ type: Input },],
98 'container': [{ type: Input },],
99 'isOpen': [{ type: Input },],
100 'onShown': [{ type: Output },],
101 'onHidden': [{ type: Output },],
102 };
103 return PopoverDirective;
104}());
105//# sourceMappingURL=popover.directive.js.map
\No newline at end of file