refactor(select): Cleaned up focusout code

edcarroll · Jul 4, 2017 · dab9323 · dab9323
1 parent a578e7d
commit dab9323
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 45 deletions.
diff --git a/demo/src/app/pages/development/test/test.page.html b/demo/src/app/pages/development/test/test.page.html
@@ -7,16 +7,6 @@
 <demo-page-content>
     <h2 class="ui dividing header">Examples</h2>
     <div class="ui segment">
-        <div class="ui fluid left icon input">
-            <i class="calendar icon"></i>
-            <input suiDatepicker
-                   [(ngModel)]="date"
-                   pickerMode="month"
-                   [pickerMaxDate]="maxDate"
-                   [pickerMinDate]="minDate"
-                   [pickerFirstDayOfWeek]="3">
-        </div>
-        <br>
-        <p>{{ date }}</p>
+
     </div>
 </demo-page-content>
diff --git a/demo/src/app/pages/development/test/test.page.ts b/demo/src/app/pages/development/test/test.page.ts
@@ -1,26 +1,10 @@
 import { Component, AfterViewInit, ViewChild, TemplateRef } from "@angular/core";
+import { FormControl, Validators } from "@angular/forms";
 
 @Component({
     selector: "demo-page-test",
     templateUrl: "./test.page.html"
 })
 export class TestPage {
-    public date:Date = new Date();
-
-    public minDate:Date;
-    public maxDate:Date;
-
-    constructor() {
-        const today = new Date();
-
-        this.minDate = new Date(today.getFullYear(), today.getMonth() - 2);
-        this.maxDate = new Date(today.getFullYear(), today.getMonth() + 2);
-
-        console.log(this.minDate);
-        console.log(this.maxDate);
-    }
-
-    public log(item:any):void {
-        console.log(item);
-    }
+    constructor() {}
 }
diff --git a/src/modules/dropdown/directives/dropdown.ts b/src/modules/dropdown/directives/dropdown.ts
@@ -118,11 +118,9 @@ export class SuiDropdown implements AfterContentInit {
 
     @HostListener("focusout", ["$event"])
     private onFocusOut(e:FocusEvent):void {
-        setTimeout(() => {
-            if (!this._element.nativeElement.contains(document.activeElement)) {
-                this.externallyClose();
-            }
-        });
+        if (!this._element.nativeElement.contains(e.relatedTarget)) {
+            this.externallyClose();
+        }
     }
 
     @HostListener("keypress", ["$event"])

diff --git a/src/modules/search/components/search.ts b/src/modules/search/components/search.ts
@@ -242,11 +242,9 @@ export class SuiSearch<T> implements AfterViewInit {
 
     @HostListener("focusout", ["$event"])
     private onFocusOut(e:FocusEvent):void {
-        setTimeout(() => {
-            if (!this._element.nativeElement.contains(document.activeElement)) {
-                this.dropdownService.setOpenState(false);
-            }
-        });
+        if (!this._element.nativeElement.contains(e.relatedTarget)) {
+            this.dropdownService.setOpenState(false);
+        }
     }
 
     @HostListener("document:click", ["$event"])

diff --git a/src/modules/select/classes/select-base.ts b/src/modules/select/classes/select-base.ts
@@ -366,12 +366,10 @@ export abstract class SuiSelectBase<T, U> implements AfterContentInit {
 
     @HostListener("focusout", ["$event"])
     private onFocusOut(e:FocusEvent):void {
-        setTimeout(() => {
-            if (!this._element.nativeElement.contains(document.activeElement)) {
-                this.dropdownService.setOpenState(false);
-                this.onTouched.emit();
-            }
-        });
+        if (!this._element.nativeElement.contains(e.relatedTarget)) {
+            this.dropdownService.setOpenState(false);
+            this.onTouched.emit();
+        }
     }
 
     @HostListener("keypress", ["$event"])