diff --git a/src/cdk/a11y/focus-key-manager.md b/src/cdk/a11y/focus-key-manager.md new file mode 100644 index 00000000000..9cbe16f0a7e --- /dev/null +++ b/src/cdk/a11y/focus-key-manager.md @@ -0,0 +1,2 @@ +### FocusKeyManager +`ListKeyManager` manages the focus of an item based on keyboard interaction. \ No newline at end of file diff --git a/src/cdk/coercion/coercion.md b/src/cdk/coercion/coercion.md new file mode 100644 index 00000000000..e050b542f3a --- /dev/null +++ b/src/cdk/coercion/coercion.md @@ -0,0 +1,3 @@ +### Coercion + +Utility functions for coercing `@Input`s into specific types. diff --git a/src/cdk/collections/collections.md b/src/cdk/collections/collections.md new file mode 100644 index 00000000000..1306b8f8df8 --- /dev/null +++ b/src/cdk/collections/collections.md @@ -0,0 +1,3 @@ +### Collections + +A set of utilities for managing collections. \ No newline at end of file diff --git a/src/cdk/keycodes/keycodes.md b/src/cdk/keycodes/keycodes.md new file mode 100644 index 00000000000..68c4cd393a4 --- /dev/null +++ b/src/cdk/keycodes/keycodes.md @@ -0,0 +1,26 @@ +### KeyCodes + +Commonly used keycode constants. + +#### Example +```ts +import {Directive} from '@angular/core'; +import {UP_ARROW, DOWN_ARROW, LEFT_ARROW, RIGHT_ARROW} from '@angular/cdk/keycodes'; + +@Directive({ + selector: '[count-arrows]' + host: { + (keypress): 'handleKeyPress($event)' + } +}) +export class ArrowCounterDirective { + arrowPressCount = 0; + + handleKeyPress(event: KeyboardEvent) { + if ([UP_ARROW, DOWN_ARROW, LEFT_ARROW, RIGHT_ARROW].includes(event.keyCode)) { + this.arrowPresscount++; + } + } +} +``` + diff --git a/src/cdk/observers/observers.md b/src/cdk/observers/observers.md new file mode 100644 index 00000000000..b5d2495a11b --- /dev/null +++ b/src/cdk/observers/observers.md @@ -0,0 +1,12 @@ +### Observers + +A directive for observing when the content of the host element changes. An event is emitted when a +mutation to the content is observed. + +#### Example + +```html +
+ +
+``` diff --git a/src/cdk/overlay/overlay.md b/src/cdk/overlay/overlay.md new file mode 100644 index 00000000000..f5c4fd2cdfa --- /dev/null +++ b/src/cdk/overlay/overlay.md @@ -0,0 +1,3 @@ +### Overlay + +A service used to manage overlays. \ No newline at end of file diff --git a/src/cdk/platform/platform.md b/src/cdk/platform/platform.md new file mode 100644 index 00000000000..0ad007d9982 --- /dev/null +++ b/src/cdk/platform/platform.md @@ -0,0 +1,3 @@ +### Platform + +A service for determing the current platform. \ No newline at end of file diff --git a/src/cdk/rxjs/rxjs.md b/src/cdk/rxjs/rxjs.md new file mode 100644 index 00000000000..c4c1718e238 --- /dev/null +++ b/src/cdk/rxjs/rxjs.md @@ -0,0 +1,27 @@ +### RxJS Usage +When dealing with RxJS operators it is important to be aware that using the "patch" imports will +pollute the global Observable object (e.g. `import "rxjs/add/operator/map"`). When creating a +component library, it is highly recommended to import the operator functions directly (e.g. +`import "rxjs/operator/map"`): + +```ts +// NO +import 'rxjs/add/operator/map'; +someObservable.map(...).subscribe(...); + +// YES +import {map} from 'rxjs/operator/map'; +map.call(someObservable, ...).subscribe(...); +``` + +#### RxChain +Because this approach can be inflexible when dealing with long chains of operators. You should use +the `RxChain` class to help with it: + +```ts +// Before +someObservable.filter(...).map(...).do(...); + +// After +RxChain.from(someObservable).call(filter, ...).call(map, ...).subscribe(...); +``` diff --git a/src/cdk/scrolling/scrolling.md b/src/cdk/scrolling/scrolling.md new file mode 100644 index 00000000000..7db6c4e046a --- /dev/null +++ b/src/cdk/scrolling/scrolling.md @@ -0,0 +1,3 @@ +### Scrolling + +Some things to help with scrollling. \ No newline at end of file diff --git a/src/cdk/scrolling/viewport.md b/src/cdk/scrolling/viewport.md new file mode 100644 index 00000000000..023088a5552 --- /dev/null +++ b/src/cdk/scrolling/viewport.md @@ -0,0 +1,3 @@ +### Viewport + +A utility for getting the bounds of the browser viewport. \ No newline at end of file