Method show

packages/angular/src/lib/directives/tooltip.ts:185–231

()

  }

  private show(): void {
    if (this.overlayRef) {
      return;
    }

    // Create overlay
    const positionStrategy = this.overlayPositionBuilder
      .flexibleConnectedTo(this.elementRef)
      .withPositions(this.getPositions())
      .withPush(false);

    this.overlayRef = this.overlay.create({
      positionStrategy,
      scrollStrategy: this.overlay.scrollStrategies.close(),
      hasBackdrop: false,
    });

    // Create component portal and attach
    const portal = new ComponentPortal(TooltipContent, this.viewContainerRef);
    const componentRef = this.overlayRef.attach(portal);
    componentRef.instance.text = this.tooltipText;

    // Detect actual position after overlay is positioned
    setTimeout(() => {
      if (this.overlayRef && this.elementRef.nativeElement) {
        const tooltipRect =
          this.overlayRef.overlayElement.getBoundingClientRect();
        const elementRect =
          this.elementRef.nativeElement.getBoundingClientRect();

        let actualPosition: "above" | "below" | "left" | "right" = "below";

        // Determine actual position based on relative positions
        if (tooltipRect.bottom <= elementRect.top) {
          actualPosition = "above";
        } else if (tooltipRect.top >= elementRect.bottom) {
          actualPosition = "below";
        } else if (tooltipRect.right <= elementRect.left) {
          actualPosition = "left";
        } else if (tooltipRect.left >= elementRect.right) {
          actualPosition = "right";
        }

        componentRef.instance.position = actualPosition;
      }
    }, 0);
  }

  private hide(): void {
    if (this.overlayRef) {