UI: Fix show widget action in tooltip

ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.models.ts

@@ -29,6 +29,7 @@ import { ILayoutController } from './layout/layout.models';
 import { DashboardContextMenuItem, WidgetContextMenuItem } from '@home/models/dashboard-component.models';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { displayGrids } from 'angular-gridster2/lib/gridsterConfig.interface';
+import { ElementRef } from '@angular/core';
 
 export declare type DashboardPageScope = 'tenant' | 'customer';
 
@@ -54,6 +55,8 @@ export interface DashboardContext {
 
 export interface IDashboardController {
   dashboardCtx: DashboardContext;
+  dashboardContainer: ElementRef;
+  elRef: ElementRef;
   openRightLayout();
   openDashboardState(stateId: string, openRightLayout: boolean);
   addWidget($event: Event, layoutCtx: DashboardPageLayoutContext);

ui-ngx/src/app/modules/home/components/widget/widget-container.component.ts

@@ -253,10 +253,12 @@ export class WidgetContainerComponent extends PageComponent implements OnInit, O
 
   private initEditWidgetActionTooltip() {
     from(import('tooltipster')).subscribe(() => {
+      const dashboardElement = this.widget.widgetContext.dashboard.stateController.dashboardCtrl.elRef.nativeElement;
       $(this.gridsterItem.el).tooltipster({
+        parent: $(dashboardElement),
         delay: this.widget.selected ? [0, 10000000] : [0, 100],
         distance: 2,
-        zIndex: 1000,
+        zIndex: 151,
         arrow: false,
         theme: ['tb-widget-edit-actions-tooltip'],
         interactive: true,
@@ -273,7 +275,9 @@ export class WidgetContainerComponent extends PageComponent implements OnInit, O
         content: '',
         functionPosition: (instance, helper, position) => {
           const clientRect = helper.origin.getBoundingClientRect();
-          position.coord.left = clientRect.right - position.size.width;
+          const container = dashboardElement.getBoundingClientRect();
+          position.coord.left = clientRect.right - position.size.width - container.left;
+          position.coord.top = position.coord.top - container.top;
           position.target = clientRect.right;
           return position;
         },