feat: add angular/cdk (#153)

* fix(modal): Focus fields beyond the modal window #UIM-11 (#154)

docs/getting-started.md

@@ -4,12 +4,12 @@
 
 #### NPM
 ```bash
-npm install --save @ptsecurity/mosaic @ptsecurity/cdk @ptsecurity/mosaic-icons @ptsecurity/mosaic-moment-adapter moment messageformat
+npm install --save @angular/cdk @ptsecurity/mosaic @ptsecurity/cdk @ptsecurity/mosaic-icons @ptsecurity/mosaic-moment-adapter moment messageformat
 ```
 
 #### Yarn
 ```bash
-yarn add @ptsecurity/mosaic @ptsecurity/cdk @ptsecurity/mosaic-icons @ptsecurity/mosaic-moment-adapter moment messageformat
+yarn add @angular/cdk @ptsecurity/mosaic @ptsecurity/cdk @ptsecurity/mosaic-icons @ptsecurity/mosaic-moment-adapter moment messageformat
 ```
 
 #### Snapshots builds

package.json

@@ -16,6 +16,7 @@
     "requiredAngularVersion": ">=8.0.0",
     "dependencies": {
         "@angular/animations": "^8.0.0",
+        "@angular/cdk": "^8.0.1",
         "@angular/common": "^8.0.0",
         "@angular/compiler": "^8.0.0",
         "@angular/core": "^8.0.0",

packages/cdk/a11y/a11y-module.ts

@@ -1,7 +1,6 @@
-
+import { PlatformModule } from '@angular/cdk/platform';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { PlatformModule } from '@ptsecurity/cdk/platform';
 
 import { CdkMonitorFocus, FOCUS_MONITOR_PROVIDER } from './focus-monitor/focus-monitor';
 

packages/cdk/a11y/focus-monitor/focus-monitor.ts

@@ -1,3 +1,4 @@
+import { Platform, supportsPassiveEventListeners } from '@angular/cdk/platform';
 import {
     Directive,
     ElementRef,
@@ -9,11 +10,8 @@ import {
     Output,
     SkipSelf
 } from '@angular/core';
-
 import { Observable, Subject, Subscription, of as observableOf } from 'rxjs';
 
-import { Platform, supportsPassiveEventListeners } from '@ptsecurity/cdk/platform';
-
 
 // Through trial and error (on iPhone 6S) they found
 // that a value of around 650ms seems appropriate.
@@ -23,11 +21,11 @@ export const TOUCH_BUFFER_MS = 650;
 export type FocusOrigin = 'touch' | 'mouse' | 'keyboard' | 'program' | null;
 
 
-type MonitoredElementInfo = {
-    unlisten: Function,
-    checkChildren: boolean,
-    subject: Subject<FocusOrigin>
-};
+interface MonitoredElementInfo {
+    unlisten: Function;
+    checkChildren: boolean;
+    subject: Subject<FocusOrigin>;
+}
 
 
 /** Monitors mouse and keyboard events to determine the cause of focus events. */
@@ -57,9 +55,6 @@ export class FocusMonitor implements OnDestroy {
     /** Map of elements being monitored to their info. */
     private _elementInfo = new Map<HTMLElement, MonitoredElementInfo>();
 
-    /** A map of global objects to lists of current listeners. */
-    private _unregisterGlobalListeners = () => {};
-
     /** The number of elements currently being monitored. */
     private _monitoredElementCount = 0;
 
@@ -87,7 +82,7 @@ export class FocusMonitor implements OnDestroy {
         // Create monitored element info.
         const info: MonitoredElementInfo = {
             unlisten: () => {},
-            checkChildren: checkChildren,
+            checkChildren,
             subject: new Subject<FocusOrigin>()
         };
         this._elementInfo.set(element, info);
@@ -145,6 +140,28 @@ export class FocusMonitor implements OnDestroy {
         this._elementInfo.forEach((_info, element) => this.stopMonitoring(element));
     }
 
+    /**
+     * Handles blur events on a registered element.
+     * @param event The blur event.
+     * @param element The monitored element.
+     */
+    _onBlur(event: FocusEvent, element: HTMLElement) {
+        // If we are counting child-element-focus as focused, make sure that we aren't just blurring in
+        // order to focus another child of the monitored element.
+        const elementInfo = this._elementInfo.get(element);
+
+        if (!elementInfo || (elementInfo.checkChildren && event.relatedTarget instanceof Node &&
+                element.contains(event.relatedTarget))) {
+            return;
+        }
+
+        this._setClasses(element);
+        elementInfo.subject.next(null);
+    }
+
+    /** A map of global objects to lists of current listeners. */
+    private _unregisterGlobalListeners = () => {};
+
     /** Register necessary event listeners on the document and window. */
     private _registerGlobalListeners() {
         // Do nothing if we're not on the browser platform.
@@ -315,25 +332,6 @@ export class FocusMonitor implements OnDestroy {
         this._lastFocusOrigin = origin;
     }
 
-    /**
-     * Handles blur events on a registered element.
-     * @param event The blur event.
-     * @param element The monitored element.
-     */
-    _onBlur(event: FocusEvent, element: HTMLElement) {
-        // If we are counting child-element-focus as focused, make sure that we aren't just blurring in
-        // order to focus another child of the monitored element.
-        const elementInfo = this._elementInfo.get(element);
-
-        if (!elementInfo || (elementInfo.checkChildren && event.relatedTarget instanceof Node &&
-                element.contains(event.relatedTarget))) {
-            return;
-        }
-
-        this._setClasses(element);
-        elementInfo.subject.next(null);
-    }
-
     private _emitOrigin(subject: Subject<FocusOrigin>, origin: FocusOrigin) {
         this._ngZone.run(() => subject.next(origin));
     }