feat: add ability to customize overlay offset (#2628)

akveo · Dec 18, 2020 · c1aafb9 · c1aafb9
1 parent 92083e8
commit c1aafb9
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 4 deletions.
diff --git a/src/framework/theme/components/autocomplete/autocomplete.directive.ts b/src/framework/theme/components/autocomplete/autocomplete.directive.ts
@@ -103,8 +103,6 @@ export class NbAutocompleteDirective<T> implements OnDestroy, AfterViewInit, Con
 
   protected overlayRef: NbOverlayRef;
 
-  protected overlayOffset = 8;
-
   protected keyManager: NbActiveDescendantKeyManager<NbOptionComponent<T>>;
 
   protected destroy$: Subject<void> = new Subject<void>();
@@ -138,6 +136,11 @@ export class NbAutocompleteDirective<T> implements OnDestroy, AfterViewInit, Con
     this._autocomplete = autocomplete;
   }
 
+  /**
+   * Determines options overlay offset (in pixels).
+   **/
+  @Input() overlayOffset: number = 8;
+
   /**
    * Determines if the input will be focused when the control value is changed
    * */

diff --git a/src/framework/theme/components/datepicker/datepicker.component.ts b/src/framework/theme/components/datepicker/datepicker.component.ts
@@ -461,6 +461,11 @@ export class NbBasePickerComponent<D, T, P> extends NbBasePicker<D, T, P>
   protected _showWeekNumber: boolean = false;
   static ngAcceptInputType_showWeekNumber: NbBooleanInput;
 
+  /**
+   * Determines picker overlay offset (in pixels).
+   * */
+  @Input() overlayOffset = 8;
+
   constructor(@Inject(NB_DOCUMENT) document,
               positionBuilder: NbPositionBuilderService,
               triggerStrategyBuilder: NbTriggerStrategyBuilderService,

diff --git a/src/framework/theme/components/select/select.component.ts b/src/framework/theme/components/select/select.component.ts
@@ -674,6 +674,11 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterContent
   protected _multiple: boolean = false;
   static ngAcceptInputType_multiple: NbBooleanInput;
 
+  /**
+   * Determines options overlay offset (in pixels).
+   **/
+  @Input() optionsOverlayOffset = 8;
+
   @HostBinding('class')
   get additionalClasses(): string[] {
     if (this.statusService.isCustomStatus(this.status)) {
@@ -727,7 +732,6 @@ export class NbSelectComponent implements OnChanges, AfterViewInit, AfterContent
   overlayPosition: NbPosition = '' as NbPosition;
 
   protected ref: NbOverlayRef;
-  protected optionsOverlayOffset = 8;
 
   protected triggerStrategy: NbTriggerStrategy;
 

diff --git a/src/framework/theme/components/tooltip/tooltip.directive.ts b/src/framework/theme/components/tooltip/tooltip.directive.ts
@@ -77,9 +77,9 @@ export class NbTooltipDirective implements OnInit, OnChanges, AfterViewInit, OnD
   protected destroy$ = new Subject<void>();
   protected tooltipComponent = NbTooltipComponent;
   protected dynamicOverlay: NbDynamicOverlay;
-  protected offset = 8;
 
   context: Object = {};
+
   /**
    * Tooltip message
    */
@@ -145,6 +145,11 @@ export class NbTooltipDirective implements OnInit, OnChanges, AfterViewInit, OnD
   @Input('nbTooltipTrigger')
   trigger: NbTrigger = NbTrigger.HINT;
 
+  /**
+   * Determines tooltip overlay offset (in pixels).
+   **/
+  @Input('nbTooltipOffset') offset = 8;
+
   @Output()
   nbTooltipShowStateChange = new EventEmitter<{ isShown: boolean }>();