Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 | 1x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x | /**
* Copyright (c) Siemens 2016 - 2025
* SPDX-License-Identifier: MIT
*/
import { ConnectedOverlayPositionChange } from '@angular/cdk/overlay';
import { NgClass, NgTemplateOutlet } from '@angular/common';
import { Component, ElementRef, inject, input, OnInit, signal, TemplateRef } from '@angular/core';
import { calculateOverlayArrowPosition, OverlayArrowPosition } from '@siemens/element-ng/common';
import { SiIconComponent } from '@siemens/element-ng/icon';
@Component({
selector: 'si-popover',
imports: [NgClass, NgTemplateOutlet, SiIconComponent],
templateUrl: './si-popover.component.html'
})
export class PopoverComponent implements OnInit {
readonly popover = input<string | TemplateRef<any>>();
/** @defaultValue '' */
readonly popoverTitle = input('');
/** @defaultValue '' */
readonly containerClass = input('');
readonly icon = input<string>();
readonly popoverContext = input<unknown>();
protected readonly positionClass = signal('');
protected readonly arrowPos = signal<OverlayArrowPosition | undefined>(undefined);
protected popoverTemplate: TemplateRef<any> | null = null;
private elementRef = inject(ElementRef);
ngOnInit(): void {
const popover = this.popover();
Iif (popover instanceof TemplateRef) {
this.popoverTemplate = popover;
}
}
/** @internal */
updateArrow(change: ConnectedOverlayPositionChange, anchor?: ElementRef): void {
const positionClass = `popover-${change.connectionPair.overlayX}-${change.connectionPair.overlayY}`;
// need two updates as class changes affect the position
this.positionClass.set(positionClass);
const arrowPos = calculateOverlayArrowPosition(change, this.elementRef, anchor);
this.arrowPos.set(arrowPos);
}
}
|