1 | import { ChangeDetectionStrategy, Input, Component } from '@angular/core';
|
2 | import { PopoverConfig } from './popover.config';
|
3 | import { getBsVer } from 'ngx-bootstrap/utils';
|
4 | import { PlacementForBs5, checkMargins } from 'ngx-bootstrap/positioning';
|
5 | export class PopoverContainerComponent {
|
6 | constructor(config) {
|
7 | this._placement = 'top';
|
8 | Object.assign(this, config);
|
9 | }
|
10 | set placement(value) {
|
11 | if (!this._bsVersions.isBs5) {
|
12 | this._placement = value;
|
13 | }
|
14 | else {
|
15 | this._placement = PlacementForBs5[value];
|
16 | }
|
17 | }
|
18 | ;
|
19 | get _bsVersions() {
|
20 | return getBsVer();
|
21 | }
|
22 | checkMarginNecessity() {
|
23 | return checkMargins(this._placement);
|
24 | }
|
25 | }
|
26 | PopoverContainerComponent.decorators = [
|
27 | { type: Component, args: [{
|
28 | selector: 'popover-container',
|
29 | changeDetection: ChangeDetectionStrategy.OnPush,
|
30 |
|
31 | host: {
|
32 | '[attr.id]': 'popoverId',
|
33 | '[class]': '"popover in popover-" + _placement + " " + "bs-popover-" + _placement + " " + _placement + " " + containerClass + checkMarginNecessity()',
|
34 | '[class.show]': '!_bsVersions.isBs3',
|
35 | '[class.bs3]': '_bsVersions.isBs3',
|
36 | role: 'tooltip',
|
37 | style: 'display:block;'
|
38 | },
|
39 | template: "<div class=\"popover-arrow arrow\"></div>\n<h3 class=\"popover-title popover-header\" *ngIf=\"title\">{{ title }}</h3>\n<div class=\"popover-content popover-body\">\n <ng-content></ng-content>\n</div>\n",
|
40 | styles: [`
|
41 | :host.bs3.popover-top {
|
42 | margin-bottom: 10px;
|
43 | }
|
44 | :host.bs3.popover.top>.arrow {
|
45 | margin-left: -2px;
|
46 | }
|
47 | :host.bs3.popover.top {
|
48 | margin-bottom: 10px;
|
49 | }
|
50 | :host.popover.bottom>.arrow {
|
51 | margin-left: -4px;
|
52 | }
|
53 | :host.bs3.bs-popover-left {
|
54 | margin-right: .5rem;
|
55 | }
|
56 | :host.bs3.bs-popover-right .arrow, :host.bs3.bs-popover-left .arrow{
|
57 | margin: .3rem 0;
|
58 | }
|
59 | `]
|
60 | },] }
|
61 | ];
|
62 | PopoverContainerComponent.ctorParameters = () => [
|
63 | { type: PopoverConfig }
|
64 | ];
|
65 | PopoverContainerComponent.propDecorators = {
|
66 | placement: [{ type: Input }],
|
67 | title: [{ type: Input }]
|
68 | };
|
69 |
|
\ | No newline at end of file |