Merge b5f63b6 into f55a2de

ng-select · Aug 24, 2019 · 954329a · 954329a
2 parents f55a2de + b5f63b6
commit 954329a
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 18 deletions.
diff --git a/src/demo/app/examples/group-default-example/group-default-example.component.ts b/src/demo/app/examples/group-default-example/group-default-example.component.ts
@@ -7,11 +7,8 @@ import { Component, OnInit } from '@angular/core';
 })
 export class GroupDefaultExampleComponent implements OnInit {
 
-    selectedAccount = 'Michael';
+    selectedAccount = 'Adam';
     accounts = [
-        { name: 'Jill', email: 'jill@email.com', age: 15, country: undefined, child: { state: 'Active' } },
-        { name: 'Henry', email: 'henry@email.com', age: 10, country: undefined, child: { state: 'Active' } },
-        { name: 'Meg', email: 'meg@email.com', age: 7, country: null, child: { state: 'Active' } },
         { name: 'Adam', email: 'adam@email.com', age: 12, country: 'United States', child: { state: 'Active' } },
         { name: 'Homer', email: 'homer@email.com', age: 47, country: '', child: { state: 'Active' } },
         { name: 'Samantha', email: 'samantha@email.com', age: 30, country: 'United States', child: { state: 'Active' } },

diff --git a/src/ng-select/lib/ng-dropdown-panel.component.ts b/src/ng-select/lib/ng-dropdown-panel.component.ts
@@ -111,6 +111,15 @@ export class NgDropdownPanelComponent implements OnInit, OnChanges, OnDestroy {
         }
     }
 
+    private get _startOffset() {
+        if (this.markedItem) {
+            const { itemHeight, panelHeight } = this._panelService.dimensions;
+            const offset = this.markedItem.index * itemHeight;
+            return panelHeight > offset ? 0 : offset;
+        }
+        return 0;
+    }
+
     @HostListener('mousedown', ['$event'])
     handleMousedown($event: MouseEvent) {
         const target = $event.target as HTMLElement;
@@ -235,7 +244,7 @@ export class NgDropdownPanelComponent implements OnInit, OnChanges, OnDestroy {
             return;
         }
 
-        this.outsideClick.emit();
+        this._zone.run(() => this.outsideClick.emit());
     }
 
     private _onItemsChange(items: NgOption[], firstChange: boolean) {
@@ -298,13 +307,6 @@ export class NgDropdownPanelComponent implements OnInit, OnChanges, OnDestroy {
         this._updateScrollHeight = true;
     }
 
-    private get _startOffset() {
-        if (this.markedItem) {
-            return this.markedItem.index * this._panelService.dimensions.itemHeight;
-        }
-        return 0;
-    }
-
     private _renderItemsRange(scrollTop = null) {
         if (scrollTop && this._lastScrollPosition === scrollTop) {
             return;

diff --git a/src/ng-select/lib/ng-dropdown-panel.service.spec.ts b/src/ng-select/lib/ng-dropdown-panel.service.spec.ts
@@ -51,10 +51,14 @@ describe('NgDropdownPanelService', () => {
         });
 
         it('should not scroll if item is in visible area', () => {
-            expect(service.getScrollTo(0, 40, 0)).toBe(0);
+            expect(service.getScrollTo(0, 40, 0)).toBeNull();
             expect(service.getScrollTo(200, 40, 0)).toBeNull();
         });
 
+        it('should not scroll if item is inside panel height', () => {
+            expect(service.getScrollTo(40, 40, 40)).toBeNull();
+        });
+
         it('should scroll by item height', () => {
             expect(service.getScrollTo(240, 40, 0)).toBe(40);
         });

diff --git a/src/ng-select/lib/ng-dropdown-panel.service.ts b/src/ng-select/lib/ng-dropdown-panel.service.ts
@@ -62,9 +62,14 @@ export class NgDropdownPanelService {
     }
 
     getScrollTo(itemTop: number, itemHeight: number, lastScroll: number) {
+        const { panelHeight } = this.dimensions;
         const itemBottom = itemTop + itemHeight;
         const top = lastScroll;
-        const bottom = top + this.dimensions.panelHeight;
+        const bottom = top + panelHeight;
+
+        if (panelHeight >= itemBottom && lastScroll === itemTop) {
+            return null;
+        }
 
         if (itemBottom > bottom) {
             return top + itemBottom - bottom;

diff --git a/src/ng-select/lib/ng-select.component.spec.ts b/src/ng-select/lib/ng-select.component.spec.ts
@@ -1045,14 +1045,12 @@ describe('NgSelectComponent', () => {
             tickAndDetectChanges(fixture);
             fixture.detectChanges();
 
-            const buffer = 4;
-            const itemHeight = 18;
             const options = fixture.debugElement.nativeElement.querySelectorAll('.ng-option');
             const marked = fixture.debugElement.nativeElement.querySelector('.ng-option-marked');
 
-            expect(options.length).toBe(22);
+            expect(options.length).toBe(18);
             expect(marked.innerText).toBe('k');
-            expect(marked.offsetTop).toBe(buffer * itemHeight);
+            expect(marked.offsetTop).toBe(180);
         }));
 
         it('should scroll to item and do not change scroll position when scrolled to visible item', fakeAsync(() => {