fix(overlay): fix enums & sample #7941

Author: PlamenaMiteva

projects/igniteui-angular/src/lib/services/overlay/overlay.ts

@@ -150,8 +150,8 @@ export class IgxOverlayService implements OnDestroy {
      */
     public static createRelativeOverlaySettings(
         target: Point | HTMLElement,
-        strategy?: RelativePositionStrategy,
-        position?: RelativePosition):
+        position?: RelativePosition,
+        strategy?: RelativePositionStrategy):
         OverlaySettings {
         const positionSettings = this.createRelativePositionSettings(position);
         const overlaySettings: OverlaySettings = {

projects/igniteui-angular/src/lib/services/overlay/utilities.ts

@@ -21,34 +21,31 @@ export enum VerticalAlignment {
 /**
  * Defines the possible values of the overlays' position strategy.
  */
-export const RelativePositionStrategy = mkenum({
-    Connected: 'connected',
-    Auto: 'auto',
-    Elastic: 'elastic'
-});
-export type RelativePositionStrategy = (typeof RelativePositionStrategy)[keyof typeof RelativePositionStrategy];
+export enum RelativePositionStrategy {
+    Connected = 'connected',
+    Auto = 'auto',
+    Elastic = 'elastic'
+}
 
 /**
  * Defines the possible positions for the relative overlay settings presets.
  */
-export const RelativePosition = mkenum({
-    Above: 'above',
-    Below: 'below',
-    Before: 'before',
-    After: 'after',
-    Default: 'default'
-});
-export type RelativePosition = (typeof RelativePosition)[keyof typeof RelativePosition];
+export enum RelativePosition {
+    Above = 'above',
+    Below = 'below',
+    Before = 'before',
+    After = 'after',
+    Default = 'default'
+}
 
 /**
  * Defines the possible positions for the absolute overlay settings presets.
  */
-export const AbsolutePosition = mkenum({
-    Bottom: 'bottom',
-    Top: 'top',
-    Center: 'center'
-});
-export type AbsolutePosition = (typeof AbsolutePosition)[keyof typeof AbsolutePosition];
+export enum AbsolutePosition {
+    Bottom = 'bottom',
+    Top = 'top',
+    Center = 'center'
+}
 
 export class Point {
     constructor(public x: number, public y: number) { }

src/app/overlay/overlay-presets.sample.ts

@@ -33,12 +33,12 @@ export class OverlayPresetsSampleComponent implements OnInit {
     private yAddition = 0;
     items = [];
     itemsCount = 10;
-    relStrategies = ['Auto', 'Connected', 'Elastic'];
+    relStrategies = [RelativePositionStrategy.Auto, RelativePositionStrategy.Connected, RelativePositionStrategy.Elastic];
     absStrategies = ['Global', 'Container'];
     positionStrategy = 'Global';
     absPosition: AbsolutePosition = AbsolutePosition.Center;
     absPositions = [AbsolutePosition.Center, AbsolutePosition.Top, AbsolutePosition.Bottom];
-    relPosition: RelativePosition = RelativePosition.Below;
+    relPosition: RelativePosition;
     relPositions = [
         RelativePosition.Above,
         RelativePosition.Below,
@@ -60,16 +60,18 @@ export class OverlayPresetsSampleComponent implements OnInit {
 
     onChange(ev) {
         switch (this.positionStrategy) {
-            case 'Auto':
-            case 'Connected':
-            case 'Elastic':
+            case RelativePositionStrategy.Auto:
+            case RelativePositionStrategy.Connected:
+            case RelativePositionStrategy.Elastic:
                 this.absPosition = null;
+                this.relPosition = this.relPosition || RelativePosition.Default;
                 this._overlaySettings = IgxOverlayService.createRelativeOverlaySettings(
                     this.button.nativeElement,
-                    RelativePositionStrategy[this.positionStrategy],
-                    this.relPosition);
+                    this.relPosition,
+                    this.positionStrategy);
                 break;
             case 'Global':
+                this.relPosition = null;
                 this._overlaySettings = IgxOverlayService.createAbsoluteOverlaySettings(this.absPosition);
                 break;
             case 'Container':