feat(toolbar): allow passing position strategy through every action C…

…loses #9065
IgniteUI · Jun 21, 2021 · 699f306 · 699f306
1 parent 76bb7f2
commit 699f306
Showing 1 changed file with 25 additions and 17 deletions.
diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.base.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.base.ts
@@ -6,6 +6,7 @@ import {
     AbsoluteScrollStrategy,
     ConnectedPositioningStrategy,
     HorizontalAlignment,
+    IPositionStrategy,
     OverlaySettings,
     PositionSettings,
     VerticalAlignment
@@ -41,6 +42,12 @@ export abstract class BaseToolbarDirective implements OnDestroy {
     @Input()
     public prompt: string;
 
+    /**
+     * Position overlay strategy
+     */
+    @Input()
+    public positionStrategy: IPositionStrategy;
+
     /**
      * Emits an event before the toggle container is opened.
      */
@@ -73,6 +80,23 @@ export abstract class BaseToolbarDirective implements OnDestroy {
 
     private $destroyer = new Subject<boolean>();
     private $sub: Subscription;
+    private _positionSettings: PositionSettings = {
+        horizontalDirection: HorizontalAlignment.Left,
+        horizontalStartPoint: HorizontalAlignment.Right,
+        verticalDirection: VerticalAlignment.Bottom,
+        verticalStartPoint: VerticalAlignment.Bottom
+    };
+
+    private get _overlaySettings() {
+        const positionStrategy = this.positionStrategy ? this.positionStrategy : new ConnectedPositioningStrategy(this._positionSettings);
+        return {
+            positionStrategy,
+            scrollStrategy: new AbsoluteScrollStrategy(),
+            modal: false,
+            closeOnEscape: true,
+            closeOnOutsideClick: true
+        };
+    }
 
     /**
      * Returns the grid containing this component.
@@ -94,7 +118,7 @@ export abstract class BaseToolbarDirective implements OnDestroy {
             const setHeight = () => actions.columnsAreaMaxHeight = this.columnListHeight ?? `${Math.max(this.grid.calcHeight, 200)}px`;
             toggleRef.onOpening.pipe(first()).subscribe(setHeight);
         }
-        toggleRef.toggle({ ..._makeOverlaySettings(), ...{ target: anchorElement, outlet: this.grid.outlet,
+        toggleRef.toggle({ ...this.positionStrategy, ...{ target: anchorElement, outlet: this.grid.outlet,
             excludeFromOutsideClick: [anchorElement] }});
 
     }
@@ -160,19 +184,3 @@ export abstract class BaseToolbarColumnActionsDirective extends BaseToolbarDirec
         this.columnActionsUI.uncheckAllColumns();
     }
 }
-
-const _makeOverlaySettings = (): OverlaySettings => {
-    const positionSettings: PositionSettings = {
-        horizontalDirection: HorizontalAlignment.Left,
-        horizontalStartPoint: HorizontalAlignment.Right,
-        verticalDirection: VerticalAlignment.Bottom,
-        verticalStartPoint: VerticalAlignment.Bottom
-    };
-    return {
-        positionStrategy: new ConnectedPositioningStrategy(positionSettings),
-        scrollStrategy: new AbsoluteScrollStrategy(),
-        modal: false,
-        closeOnEscape: true,
-        closeOnOutsideClick: true
-    };
-};