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 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 | 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 4x 4x 9x 9x 1x 81x 9x 9x | /**
* Copyright (c) Siemens 2016 - 2026
* SPDX-License-Identifier: MIT
*/
import { Overlay, OverlayRef } from '@angular/cdk/overlay';
import { ComponentPortal } from '@angular/cdk/portal';
import { ComponentRef, ElementRef, inject, Injectable, Injector } from '@angular/core';
import { getOverlay, getPositionStrategy, positions } from '@siemens/element-ng/common';
import { Subscription } from 'rxjs';
import { TooltipComponent } from './si-tooltip.component';
import { SI_TOOLTIP_CONFIG, SiTooltipContent } from './si-tooltip.model';
/**
* TooltipRef is attached to a specific element.
* Use it to show or hide a tooltip for that element.
*
* @internal
*/
class TooltipRef {
constructor(
private overlayRef: OverlayRef,
private element: ElementRef,
private injector?: Injector
) {}
private subscription?: Subscription;
show(): void {
Iif (this.overlayRef.hasAttached()) {
return;
}
const toolTipPortal = new ComponentPortal(TooltipComponent, undefined, this.injector);
const tooltipRef: ComponentRef<TooltipComponent> = this.overlayRef.attach(toolTipPortal);
const positionStrategy = getPositionStrategy(this.overlayRef);
this.subscription?.unsubscribe();
this.subscription = positionStrategy?.positionChanges.subscribe(change =>
tooltipRef.instance.updateTooltipPosition(change, this.element)
);
}
hide(): void {
this.overlayRef.detach();
this.subscription?.unsubscribe();
}
destroy(): void {
this.overlayRef.dispose();
this.subscription?.unsubscribe();
}
}
/**
* A service to create tooltips for specific elements.
* Use this if the tooltip directive is not suitable.
* Must not be used outside element-ng.
*
* @internal
*/
// We cannot provide this in root, as people may override the cdk overlay creation.
@Injectable()
export class SiTooltipService {
private overlay = inject(Overlay);
createTooltip(config: {
describedBy: string;
element: ElementRef;
placement: keyof typeof positions;
injector?: Injector;
tooltip: () => SiTooltipContent;
tooltipContext: () => unknown;
}): TooltipRef {
const injector = Injector.create({
parent: config.injector,
providers: [
{
provide: SI_TOOLTIP_CONFIG,
useValue: {
id: config.describedBy,
tooltip: config.tooltip,
tooltipContext: config.tooltipContext
}
}
]
});
return new TooltipRef(
getOverlay(config.element, this.overlay, false, config.placement),
config.element,
injector
);
}
}
export type { TooltipRef };
|