From 3ad85f81bdb55197b15b0878904627d14a2026ac Mon Sep 17 00:00:00 2001 From: Jeremy Elbourn Date: Tue, 28 Aug 2018 16:42:49 -0700 Subject: [PATCH] fix: explictly declare types for mixin base classes As of TypeScript 2.9, tsc will inline imports for inferred types with the `import("...")` syntax. However, this inlining happens *after* `paths` are resolved. This means that in places where we import from `@angular/material/core` in source end up having relative paths (e.g. `../core/common-behaviors/index`) in the generated d.ts files. These relative import paths become incorrect when moved into our package structure, breaking downstream apps. --- package-lock.json | 116 ++++++++++-------- package.json | 28 ++--- src/cdk/table/can-stick.ts | 6 +- src/cdk/table/cell.ts | 8 +- src/cdk/table/row.ts | 8 +- src/lib/autocomplete/autocomplete.ts | 28 +++-- src/lib/button-toggle/button-toggle.ts | 15 ++- src/lib/button/button.ts | 9 +- src/lib/checkbox/checkbox.ts | 15 ++- src/lib/chips/chip-list.ts | 12 +- src/lib/chips/chip.ts | 10 +- src/lib/core/common-behaviors/color.ts | 7 +- .../core/common-behaviors/disable-ripple.ts | 6 +- src/lib/core/common-behaviors/disabled.ts | 5 +- src/lib/core/common-behaviors/error-state.ts | 10 +- src/lib/core/common-behaviors/index.ts | 12 +- src/lib/core/common-behaviors/initialized.ts | 5 +- src/lib/core/common-behaviors/tabindex.ts | 6 +- src/lib/core/option/optgroup.ts | 8 +- src/lib/datepicker/datepicker-input.ts | 6 +- src/lib/datepicker/datepicker.ts | 19 ++- src/lib/form-field/form-field.ts | 5 +- src/lib/icon/icon.ts | 5 +- src/lib/input/input.ts | 14 ++- src/lib/list/list.ts | 14 ++- src/lib/list/selection-list.ts | 8 +- src/lib/menu/menu-item.ts | 9 +- src/lib/paginator/paginator.ts | 10 +- src/lib/progress-bar/progress-bar.ts | 5 +- src/lib/progress-spinner/progress-spinner.ts | 20 +-- src/lib/radio/radio.ts | 14 ++- .../update/material/typescript-specifiers.ts | 4 - .../update/rules/checkImportMiscRule.ts | 45 +++---- src/lib/select/select.ts | 17 ++- src/lib/slide-toggle/slide-toggle.ts | 17 ++- src/lib/slider/slider.ts | 15 ++- src/lib/sort/sort-header.ts | 7 +- src/lib/sort/sort.ts | 18 ++- src/lib/tabs/tab-group.ts | 7 +- src/lib/tabs/tab-header.ts | 5 +- src/lib/tabs/tab-label-wrapper.ts | 6 +- src/lib/tabs/tab-nav-bar/tab-nav-bar.ts | 16 +-- src/lib/tabs/tab.ts | 7 +- src/lib/toolbar/toolbar.ts | 12 +- src/lib/tree/node.ts | 16 ++- 45 files changed, 392 insertions(+), 243 deletions(-) diff --git a/package-lock.json b/package-lock.json index 01ce424196d1..f38986d46aa2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -35,17 +35,17 @@ } }, "@angular/animations": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-6.1.0.tgz", - "integrity": "sha512-9IJs1czyoOlgcaY3QUyQI0XeTFX45Qr/o5qlPrce240gi7TXbdJs3WIbLzxx7BhMf20GholCaOvSS3BZrNlFSA==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-7.0.0-beta.3.tgz", + "integrity": "sha512-mZswGKBYbdiyw4knCO2tlZXuZaUDAh4gX8+FtPL568JXozc4w/ju2nJ/X4oOEmLZIWwDX5ubqOWe88uR5blLHQ==", "requires": { "tslib": "^1.9.0" } }, "@angular/bazel": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/bazel/-/bazel-6.1.0.tgz", - "integrity": "sha512-NmAqcj9RK98jauCgpNp3gE8jPjs2Oexszj1pyKyh8lg1VUYhFHFp3SVos0JEYtgu1I2MvX4H/veDCEepD5u8vg==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/bazel/-/bazel-7.0.0-beta.3.tgz", + "integrity": "sha512-e+vYniNRuz/1NTpCWmzSI8wvUSqZ6+bnYe5fVMpo3wdkU5q9P49+3+HRCR7oaQAVlldFoF5gdF7qhszHKECHmQ==", "dev": true, "requires": { "@bazel/typescript": "^0.15.0", @@ -62,31 +62,34 @@ } }, "@angular/common": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/common/-/common-6.1.0.tgz", - "integrity": "sha512-uxdjxbuTYiCsOcrfO9EumGrfXo+7nB7HlS9F4wraKcnR22oJYNUh36meFKZwpoj5pDIBLnZQu75boI16o3W+SQ==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/common/-/common-7.0.0-beta.3.tgz", + "integrity": "sha512-PuTcwCtgVJpXrUoUJIs1azzgbAMtU5zEdkGHiaMZyO6PmHXV1cq30zlkqIIvFclb9K9Vc2ZC4KIlrMzIWeaAtA==", "requires": { "tslib": "^1.9.0" } }, "@angular/compiler": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-6.1.0.tgz", - "integrity": "sha512-5c8ZYCFv0xccy0F12zBRIJX0pJd9BgCThJuhVJAuaRFFOqPZl8FKEO3SFqKJNywT0UktZD9JpYFKxhUVxuSHDg==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-7.0.0-beta.3.tgz", + "integrity": "sha512-lQmJuqQrLvyEMylATy3fPVYSuj1Y8WDb8YVdp2kkf+dpopFEI1bMNTV7t8HHuaUcYuGRku0wyzLnTioQo8ineg==", "requires": { "tslib": "^1.9.0" } }, "@angular/compiler-cli": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-6.1.0.tgz", - "integrity": "sha512-g4fXQwAYnxtr08BK3CiodJsUXz3fIBCVfZaWIcLMdOlyarFDEvB3TA9qfPkQtlndm87WpXjZ6Xd9OAkmG8t8dw==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-7.0.0-beta.3.tgz", + "integrity": "sha512-CUXkntV2sZQBkK5i3v/ggnlFznfwmaqkddpawcXHfd+xDllRsFz7VrpO5hveqrg6y54jJqIuDm4iBXRrYqhiHw==", "dev": true, "requires": { "chokidar": "^1.4.2", + "convert-source-map": "^1.5.1", + "magic-string": "^0.25.0", "minimist": "^1.2.0", "reflect-metadata": "^0.1.2", - "tsickle": "^0.30.0" + "source-map": "^0.6.1", + "tsickle": "^0.32.1" }, "dependencies": { "anymatch": { @@ -193,6 +196,15 @@ "is-buffer": "^1.1.5" } }, + "magic-string": { + "version": "0.25.0", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.0.tgz", + "integrity": "sha512-Msbwa9oNYNPjwVh9ury5X2BHbTFWoirTlzuf4X+pIoSOQVKNRJHXTx1WmKYuXzRM4QZFv8dGXyZvhDMmWhGLPw==", + "dev": true, + "requires": { + "sourcemap-codec": "^1.4.1" + } + }, "micromatch": { "version": "2.3.11", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz", @@ -215,9 +227,9 @@ } }, "tsickle": { - "version": "0.30.0", - "resolved": "https://registry.npmjs.org/tsickle/-/tsickle-0.30.0.tgz", - "integrity": "sha512-A4ALnEDQNrECn5xhgHmoXKM5qERCM395pKIfqcV57ex3zEInVogu/A191Btv8OPEINkr3xQ3Q2XRywyqkge3Qg==", + "version": "0.32.1", + "resolved": "https://registry.npmjs.org/tsickle/-/tsickle-0.32.1.tgz", + "integrity": "sha512-JW9j+W0SaMSZGejIFZBk0AiPfnhljK3oLx5SaqxrJhjlvzFyPml5zqG1/PuScUj6yTe1muEqwk5CnDK0cOZmKw==", "dev": true, "requires": { "jasmine-diff": "^0.1.3", @@ -230,59 +242,59 @@ } }, "@angular/core": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/core/-/core-6.1.0.tgz", - "integrity": "sha512-gWu9Q7q2+fhFC5dl/BvGW7Ha7NUJtK9wQLYQlfIMim4lKTOiM1/S0MYBVMrEq58ldMr9DnA35f5jGno3x6/v+g==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/core/-/core-7.0.0-beta.3.tgz", + "integrity": "sha512-G+gZPLDvN68O+C9XtYJTn5VSISyH6yDs1ZbbOfRpCTTNFAscjbKfrs+MjCoxJkPNIBbpVfoSTFopHMWQmfgfvA==", "requires": { "tslib": "^1.9.0" } }, "@angular/elements": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/elements/-/elements-6.1.0.tgz", - "integrity": "sha512-9X6ZeiPduQSfesg5kDeDWeqEmsLLF5YbCxOT8tzzvo1Zdw3uAYupmDSpzxPaVxD3JduCYlGjhLRGngdCtiXcVw==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/elements/-/elements-7.0.0-beta.3.tgz", + "integrity": "sha512-RUe/zpfvZQTy57n+ZBXAMA3r+oBUNgzwDbYuX9adC9kzWbK46+j8uhLPKAO8fa2VR0vAL07q5Rdg6gnMz2HwwA==", "requires": { "tslib": "^1.9.0" } }, "@angular/forms": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-6.1.0.tgz", - "integrity": "sha512-6InfsKWEL9w2RvTXjy5R3F8GRjENT9d444o95aSvf+ZK7KsYOeIwcYgN2pw+LjfNu2O3EbAqps8APQ6oD/Fn3A==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-7.0.0-beta.3.tgz", + "integrity": "sha512-aSt7qdgfa7bRRDkKq9DjeP/SCLe1NHLksZBNlv/8CAZ3c0yPsZ9m+4P1ouHwVwUwokjPB+IcLV+PRhKGtdt49Q==", "requires": { "tslib": "^1.9.0" } }, "@angular/http": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/http/-/http-6.1.0.tgz", - "integrity": "sha512-Tky6T93xX22m7zeXSdxALXglKh00QerubV9+exKLUethDGE/xvdRKKdsiMo72w+4yj/1bXAd4fXw+SDneUco7Q==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/http/-/http-7.0.0-beta.3.tgz", + "integrity": "sha512-JoqnwsRB01B+AFJVvle3iLb4CePr6lhkRrCst8Yz9Ci8Vk8R+zhkIUECZXtTviepBi/W2xF4pSFhLadic3yI8w==", "dev": true, "requires": { "tslib": "^1.9.0" } }, "@angular/platform-browser": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-6.1.0.tgz", - "integrity": "sha512-LcpcHLpy+fjN+gKcnTkWuTTuF+uYT350mje1kNr4Advoco76tXYBjAda/EehG+vmQmDTd5E+uxJhKJr/1POVEw==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-7.0.0-beta.3.tgz", + "integrity": "sha512-BdjaumdkdVRZmdwcZ4VNT0aHEa9MEeFAXsYue29RI+QCes1v+FP996+uqFBB8eSLQm0qlnrOg9AYu9YqkS8jwQ==", "requires": { "tslib": "^1.9.0" } }, "@angular/platform-browser-dynamic": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-6.1.0.tgz", - "integrity": "sha512-gjOJ38ciuIgdAuG8bEs/sdJmkfm/oICLrCcQexz+EUCZAiqbKDb0HvFTDaKaLtR7iDbTXVMQhoYMOyTY40FwLQ==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-7.0.0-beta.3.tgz", + "integrity": "sha512-F/ZK5G49oyfl/4sOPWKzae5gxbYbPzB8Zhe4s3thfniLbt5a0gXgz5QquSfyOpyTF7Cv2/nxjnJDNUxBvuI7QQ==", "dev": true, "requires": { "tslib": "^1.9.0" } }, "@angular/platform-server": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-6.1.0.tgz", - "integrity": "sha512-hlE2/K+93ihMLXphlusdvRET4PR3Wo6vOUHb0SKVWYUo/pw7EpPIdeRs49xjsiW08TNwFI5UGYUQn+pd9ATIjA==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/platform-server/-/platform-server-7.0.0-beta.3.tgz", + "integrity": "sha512-F5gXoWIpJgVmKHG6eR2GfV7Pc6HorJwAfRlMK5CWiFjrbNbTwkanBo4h2HV5lCNexhM2vQmkTEoxTHaeqLxoFQ==", "dev": true, "requires": { "domino": "^2.0.1", @@ -291,18 +303,18 @@ } }, "@angular/router": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/router/-/router-6.1.0.tgz", - "integrity": "sha512-tIcHLuat19cnoQBbOfe/8zAHVqf/9S17YgwSO6VUPTuXLRe9ZBgYT50BzqRhcm8ODOqVmLBQYlzP7zRcNRkHDA==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/router/-/router-7.0.0-beta.3.tgz", + "integrity": "sha512-5hT204P+1vJ2tB8DDaeouWxm9naO+uZOZUaO1TeuZ7GmuG7dr+pa9lgUXTa4lCf1l+2vWJu9QBRC9I7GASpyAg==", "dev": true, "requires": { "tslib": "^1.9.0" } }, "@angular/upgrade": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/@angular/upgrade/-/upgrade-6.1.0.tgz", - "integrity": "sha512-HWpXisVY1uyIhWXz41KciweCWAD7oHajkhnDXlNBvDaIbnYkUSSr2D5DOCR8jIooV1HqJMkXCqRR0nwm3WEjJg==", + "version": "7.0.0-beta.3", + "resolved": "https://registry.npmjs.org/@angular/upgrade/-/upgrade-7.0.0-beta.3.tgz", + "integrity": "sha512-WSM4t3kGc9CJUB+uflZ/Xg3oU+cULQ/Dp5+gN8+9eD9x6eBRI2Qdd/4FGKLCAtOveaPjTwM9HQVH5oz5/TDFzw==", "dev": true, "requires": { "tslib": "^1.9.0" @@ -3388,6 +3400,12 @@ "trim-off-newlines": "^1.0.0" } }, + "convert-source-map": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz", + "integrity": "sha1-uCeAl7m8IpNl3lxiz1/K7YtVmeU=", + "dev": true + }, "cookie": { "version": "0.3.1", "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz", @@ -4088,9 +4106,9 @@ } }, "domino": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/domino/-/domino-2.0.3.tgz", - "integrity": "sha512-QkW2THVtKJw9FmV6awFQbcpaJPIqQtF+F1PMO5EXIdULVit9IaU3w+ZQgBjrR6hSHgP97TKyo/tcFqkgwfYenA==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/domino/-/domino-2.1.0.tgz", + "integrity": "sha512-xINSODvrnuQcm3eXJN4IkBR+JxqLrJN8Ge4fd00y1b7HsY0A4huKN5BflSS/oo8quBWmocTfWdFvrw2H8TjGqQ==", "dev": true }, "domutils": { diff --git a/package.json b/package.json index 4e8888187a2e..1efcc1b8ed49 100644 --- a/package.json +++ b/package.json @@ -27,13 +27,13 @@ "version": "6.4.6", "requiredAngularVersion": ">=6.0.0 <7.0.0", "dependencies": { - "@angular/animations": "^6.1.0", - "@angular/common": "^6.1.0", - "@angular/compiler": "^6.1.0", - "@angular/core": "^6.1.0", - "@angular/elements": "^6.1.0", - "@angular/forms": "^6.1.0", - "@angular/platform-browser": "^6.1.0", + "@angular/animations": "7.0.0-beta.3", + "@angular/common": "7.0.0-beta.3", + "@angular/compiler": "7.0.0-beta.3", + "@angular/core": "7.0.0-beta.3", + "@angular/elements": "7.0.0-beta.3", + "@angular/forms": "7.0.0-beta.3", + "@angular/platform-browser": "7.0.0-beta.3", "@webcomponents/custom-elements": "^1.1.0", "core-js": "^2.4.1", "rxjs": "^6.2.0", @@ -45,13 +45,13 @@ "devDependencies": { "@angular-devkit/core": "^0.7.1", "@angular-devkit/schematics": "^0.7.1", - "@angular/bazel": "^6.1.0", - "@angular/compiler-cli": "^6.1.0", - "@angular/http": "^6.1.0", - "@angular/platform-browser-dynamic": "^6.1.0", - "@angular/platform-server": "^6.1.0", - "@angular/router": "^6.1.0", - "@angular/upgrade": "^6.1.0", + "@angular/bazel": "7.0.0-beta.3", + "@angular/compiler-cli": "7.0.0-beta.3", + "@angular/http": "7.0.0-beta.3", + "@angular/platform-browser-dynamic": "7.0.0-beta.3", + "@angular/platform-server": "7.0.0-beta.3", + "@angular/router": "7.0.0-beta.3", + "@angular/upgrade": "7.0.0-beta.3", "@bazel/ibazel": "0.3.1", "@google-cloud/storage": "^1.1.1", "@octokit/rest": "^15.9.4", diff --git a/src/cdk/table/can-stick.ts b/src/cdk/table/can-stick.ts index bbabd43658aa..f4f58771f9cf 100644 --- a/src/cdk/table/can-stick.ts +++ b/src/cdk/table/can-stick.ts @@ -31,14 +31,16 @@ export interface CanStick { resetStickyChanged(): void; } +/** @docs-private */ +export type CanStickCtor = Constructor; + /** * Mixin to provide a directive with a function that checks if the sticky input has been * changed since the last time the function was called. Essentially adds a dirty-check to the * sticky value. * @docs-private */ -export function mixinHasStickyInput>(base: T): - Constructor & T { +export function mixinHasStickyInput>(base: T): CanStickCtor & T { return class extends base { /** Whether sticky positioning should be applied. */ get sticky(): boolean { return this._sticky; } diff --git a/src/cdk/table/cell.ts b/src/cdk/table/cell.ts index e6cbb797664f..de3c5c6a0f60 100644 --- a/src/cdk/table/cell.ts +++ b/src/cdk/table/cell.ts @@ -6,9 +6,10 @@ * found in the LICENSE file at https://angular.io/license */ -import {ContentChild, Directive, ElementRef, Input, TemplateRef} from '@angular/core'; import {coerceBooleanProperty} from '@angular/cdk/coercion'; -import {CanStick, mixinHasStickyInput} from './can-stick'; +import {ContentChild, Directive, ElementRef, Input, TemplateRef} from '@angular/core'; +import {CanStick, CanStickCtor, mixinHasStickyInput} from './can-stick'; + /** Base interface for a cell definition. Captures a column's cell template definition. */ export interface CellDef { @@ -45,7 +46,8 @@ export class CdkFooterCellDef implements CellDef { // Boilerplate for applying mixins to CdkColumnDef. /** @docs-private */ export class CdkColumnDefBase {} -export const _CdkColumnDefBase = mixinHasStickyInput(CdkColumnDefBase); +export const _CdkColumnDefBase: CanStickCtor & typeof CdkColumnDefBase = + mixinHasStickyInput(CdkColumnDefBase); /** * Column definition for the CDK table. diff --git a/src/cdk/table/row.ts b/src/cdk/table/row.ts index d9cf19517f3c..31e7379cb9d4 100644 --- a/src/cdk/table/row.ts +++ b/src/cdk/table/row.ts @@ -20,8 +20,8 @@ import { ViewContainerRef, ViewEncapsulation, } from '@angular/core'; +import {CanStick, CanStickCtor, mixinHasStickyInput} from './can-stick'; import {CdkCellDef, CdkColumnDef} from './cell'; -import {CanStick, mixinHasStickyInput} from './can-stick'; /** * The row template that can be used by the mat-table. Should not be used outside of the @@ -76,7 +76,8 @@ export abstract class BaseRowDef implements OnChanges { // Boilerplate for applying mixins to CdkHeaderRowDef. /** @docs-private */ export class CdkHeaderRowDefBase extends BaseRowDef {} -export const _CdkHeaderRowDefBase = mixinHasStickyInput(CdkHeaderRowDefBase); +export const _CdkHeaderRowDefBase: CanStickCtor & typeof CdkHeaderRowDefBase = + mixinHasStickyInput(CdkHeaderRowDefBase); /** * Header row definition for the CDK table. @@ -101,7 +102,8 @@ export class CdkHeaderRowDef extends _CdkHeaderRowDefBase implements CanStick, O // Boilerplate for applying mixins to CdkFooterRowDef. /** @docs-private */ export class CdkFooterRowDefBase extends BaseRowDef {} -export const _CdkFooterRowDefBase = mixinHasStickyInput(CdkFooterRowDefBase); +export const _CdkFooterRowDefBase: CanStickCtor & typeof CdkFooterRowDefBase = + mixinHasStickyInput(CdkFooterRowDefBase); /** * Footer row definition for the CDK table. diff --git a/src/lib/autocomplete/autocomplete.ts b/src/lib/autocomplete/autocomplete.ts index 33344115a7c9..bbd5a0ca1b26 100644 --- a/src/lib/autocomplete/autocomplete.ts +++ b/src/lib/autocomplete/autocomplete.ts @@ -5,32 +5,34 @@ * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */ + +import {ActiveDescendantKeyManager} from '@angular/cdk/a11y'; +import {coerceBooleanProperty} from '@angular/cdk/coercion'; import { AfterContentInit, + ChangeDetectionStrategy, + ChangeDetectorRef, Component, ContentChildren, ElementRef, + EventEmitter, + Inject, + InjectionToken, Input, + Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation, - ChangeDetectorRef, - ChangeDetectionStrategy, - EventEmitter, - Output, - InjectionToken, - Inject, } from '@angular/core'; import { - MatOption, - MatOptgroup, + CanDisableRipple, + CanDisableRippleCtor, MAT_OPTION_PARENT_COMPONENT, + MatOptgroup, + MatOption, mixinDisableRipple, - CanDisableRipple, } from '@angular/material/core'; -import {ActiveDescendantKeyManager} from '@angular/cdk/a11y'; -import {coerceBooleanProperty} from '@angular/cdk/coercion'; /** @@ -48,10 +50,12 @@ export class MatAutocompleteSelectedEvent { public option: MatOption) { } } + // Boilerplate for applying mixins to MatAutocomplete. /** @docs-private */ export class MatAutocompleteBase {} -export const _MatAutocompleteMixinBase = mixinDisableRipple(MatAutocompleteBase); +export const _MatAutocompleteMixinBase: CanDisableRippleCtor & typeof MatAutocompleteBase = + mixinDisableRipple(MatAutocompleteBase); /** Default `mat-autocomplete` options that can be overridden. */ export interface MatAutocompleteDefaultOptions { diff --git a/src/lib/button-toggle/button-toggle.ts b/src/lib/button-toggle/button-toggle.ts index c84929eaf237..616c1cabff04 100644 --- a/src/lib/button-toggle/button-toggle.ts +++ b/src/lib/button-toggle/button-toggle.ts @@ -8,8 +8,10 @@ import {FocusMonitor} from '@angular/cdk/a11y'; import {coerceBooleanProperty} from '@angular/cdk/coercion'; +import {SelectionModel} from '@angular/cdk/collections'; import { AfterContentInit, + Attribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, @@ -26,16 +28,17 @@ import { QueryList, ViewChild, ViewEncapsulation, - Attribute, } from '@angular/core'; import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; import { CanDisable, + CanDisableCtor, CanDisableRipple, + CanDisableRippleCtor, mixinDisabled, - mixinDisableRipple + mixinDisableRipple, } from '@angular/material/core'; -import {SelectionModel} from '@angular/cdk/collections'; + /** Acceptable types for a button toggle. */ export type ToggleType = 'checkbox' | 'radio'; @@ -43,7 +46,8 @@ export type ToggleType = 'checkbox' | 'radio'; // Boilerplate for applying mixins to MatButtonToggleGroup and MatButtonToggleGroupMultiple /** @docs-private */ export class MatButtonToggleGroupBase {} -export const _MatButtonToggleGroupMixinBase = mixinDisabled(MatButtonToggleGroupBase); +export const _MatButtonToggleGroupMixinBase: CanDisableCtor & typeof MatButtonToggleGroupBase = + mixinDisabled(MatButtonToggleGroupBase); /** * Provider Expression that allows mat-button-toggle-group to register as a ControlValueAccessor. @@ -315,7 +319,8 @@ export class MatButtonToggleGroup extends _MatButtonToggleGroupMixinBase impleme // Boilerplate for applying mixins to the MatButtonToggle class. /** @docs-private */ export class MatButtonToggleBase {} -export const _MatButtonToggleMixinBase = mixinDisableRipple(MatButtonToggleBase); +export const _MatButtonToggleMixinBase: CanDisableRippleCtor & typeof MatButtonToggleBase = + mixinDisableRipple(MatButtonToggleBase); /** Single button inside of a toggle group. */ @Component({ diff --git a/src/lib/button/button.ts b/src/lib/button/button.ts index 50823689ffbc..20343e0db528 100644 --- a/src/lib/button/button.ts +++ b/src/lib/button/button.ts @@ -23,10 +23,13 @@ import { CanColor, CanDisable, CanDisableRipple, + CanColorCtor, + CanDisableCtor, + CanDisableRippleCtor, MatRipple, mixinColor, mixinDisabled, - mixinDisableRipple + mixinDisableRipple, } from '@angular/material/core'; import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations'; @@ -52,8 +55,10 @@ const BUTTON_HOST_ATTRIBUTES = [ export class MatButtonBase { constructor(public _elementRef: ElementRef) {} } -export const _MatButtonMixinBase = mixinColor(mixinDisabled(mixinDisableRipple(MatButtonBase))); +export const _MatButtonMixinBase: + CanDisableRippleCtor & CanDisableCtor & CanColorCtor & typeof MatButtonBase = + mixinColor(mixinDisabled(mixinDisableRipple(MatButtonBase))); /** * Material design button. diff --git a/src/lib/checkbox/checkbox.ts b/src/lib/checkbox/checkbox.ts index 0a955eb0d67a..ff46c7d0aee6 100644 --- a/src/lib/checkbox/checkbox.ts +++ b/src/lib/checkbox/checkbox.ts @@ -29,9 +29,13 @@ import { import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; import { CanColor, + CanColorCtor, CanDisable, + CanDisableCtor, CanDisableRipple, + CanDisableRippleCtor, HasTabIndex, + HasTabIndexCtor, MatRipple, mixinColor, mixinDisabled, @@ -39,8 +43,8 @@ import { mixinTabIndex, RippleRef, } from '@angular/material/core'; -import {MAT_CHECKBOX_CLICK_ACTION, MatCheckboxClickAction} from './checkbox-config'; import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations'; +import {MAT_CHECKBOX_CLICK_ACTION, MatCheckboxClickAction} from './checkbox-config'; // Increasing integer for generating unique ids for checkbox components. @@ -85,8 +89,13 @@ export class MatCheckboxChange { export class MatCheckboxBase { constructor(public _elementRef: ElementRef) {} } -export const _MatCheckboxMixinBase = - mixinTabIndex(mixinColor(mixinDisableRipple(mixinDisabled(MatCheckboxBase)), 'accent')); +export const _MatCheckboxMixinBase: + HasTabIndexCtor & + CanColorCtor & + CanDisableRippleCtor & + CanDisableCtor & + typeof MatCheckboxBase = + mixinTabIndex(mixinColor(mixinDisableRipple(mixinDisabled(MatCheckboxBase)), 'accent')); /** diff --git a/src/lib/chips/chip-list.ts b/src/lib/chips/chip-list.ts index 2dfc084a31ec..c5d4f9cba617 100644 --- a/src/lib/chips/chip-list.ts +++ b/src/lib/chips/chip-list.ts @@ -10,7 +10,7 @@ import {FocusKeyManager} from '@angular/cdk/a11y'; import {Directionality} from '@angular/cdk/bidi'; import {coerceBooleanProperty} from '@angular/cdk/coercion'; import {SelectionModel} from '@angular/cdk/collections'; -import {BACKSPACE, HOME, END} from '@angular/cdk/keycodes'; +import {BACKSPACE, END, HOME} from '@angular/cdk/keycodes'; import { AfterContentInit, ChangeDetectionStrategy, @@ -30,7 +30,12 @@ import { ViewEncapsulation, } from '@angular/core'; import {ControlValueAccessor, FormGroupDirective, NgControl, NgForm} from '@angular/forms'; -import {CanUpdateErrorState, ErrorStateMatcher, mixinErrorState} from '@angular/material/core'; +import { + CanUpdateErrorState, + CanUpdateErrorStateCtor, + ErrorStateMatcher, + mixinErrorState, +} from '@angular/material/core'; import {MatFormFieldControl} from '@angular/material/form-field'; import {merge, Observable, Subject, Subscription} from 'rxjs'; import {startWith, takeUntil} from 'rxjs/operators'; @@ -47,7 +52,8 @@ export class MatChipListBase { /** @docs-private */ public ngControl: NgControl) {} } -export const _MatChipListMixinBase = mixinErrorState(MatChipListBase); +export const _MatChipListMixinBase: CanUpdateErrorStateCtor & typeof MatChipListBase = + mixinErrorState(MatChipListBase); // Increasing integer for generating unique ids for chip-list components. diff --git a/src/lib/chips/chip.ts b/src/lib/chips/chip.ts index 3c3939cf4da7..86c1b8a3b5ae 100644 --- a/src/lib/chips/chip.ts +++ b/src/lib/chips/chip.ts @@ -25,8 +25,11 @@ import { } from '@angular/core'; import { CanColor, + CanColorCtor, CanDisable, + CanDisableCtor, CanDisableRipple, + CanDisableRippleCtor, MAT_RIPPLE_GLOBAL_OPTIONS, mixinColor, mixinDisabled, @@ -34,7 +37,7 @@ import { RippleConfig, RippleGlobalOptions, RippleRenderer, - RippleTarget + RippleTarget, } from '@angular/material/core'; import {Subject} from 'rxjs'; import {take} from 'rxjs/operators'; @@ -64,8 +67,9 @@ export class MatChipBase { constructor(public _elementRef: ElementRef) {} } -export const _MatChipMixinBase = - mixinColor(mixinDisableRipple(mixinDisabled(MatChipBase)), 'primary'); +export const _MatChipMixinBase: + CanColorCtor & CanDisableRippleCtor & CanDisableCtor & typeof MatChipBase = + mixinColor(mixinDisableRipple(mixinDisabled(MatChipBase)), 'primary'); const CHIP_ATTRIBUTE_NAMES = ['mat-basic-chip']; diff --git a/src/lib/core/common-behaviors/color.ts b/src/lib/core/common-behaviors/color.ts index 9fde822a52b0..99068fbabe43 100644 --- a/src/lib/core/common-behaviors/color.ts +++ b/src/lib/core/common-behaviors/color.ts @@ -15,6 +15,9 @@ export interface CanColor { color: ThemePalette; } +/** @docs-private */ +export type CanColorCtor = Constructor; + /** @docs-private */ export interface HasElementRef { _elementRef: ElementRef; @@ -24,8 +27,8 @@ export interface HasElementRef { export type ThemePalette = 'primary' | 'accent' | 'warn' | undefined; /** Mixin to augment a directive with a `color` property. */ -export function mixinColor>(base: T, - defaultColor?: ThemePalette): Constructor & T { +export function mixinColor>( + base: T, defaultColor?: ThemePalette): CanColorCtor & T { return class extends base { private _color: ThemePalette; diff --git a/src/lib/core/common-behaviors/disable-ripple.ts b/src/lib/core/common-behaviors/disable-ripple.ts index ad5748b2615e..3ecf5d4f6860 100644 --- a/src/lib/core/common-behaviors/disable-ripple.ts +++ b/src/lib/core/common-behaviors/disable-ripple.ts @@ -15,9 +15,11 @@ export interface CanDisableRipple { disableRipple: boolean; } +/** @docs-private */ +export type CanDisableRippleCtor = Constructor; + /** Mixin to augment a directive with a `disableRipple` property. */ -export function mixinDisableRipple>(base: T) - : Constructor & T { +export function mixinDisableRipple>(base: T): CanDisableRippleCtor & T { return class extends base { private _disableRipple: boolean = false; diff --git a/src/lib/core/common-behaviors/disabled.ts b/src/lib/core/common-behaviors/disabled.ts index da042e2c270c..21ed4af1d66a 100644 --- a/src/lib/core/common-behaviors/disabled.ts +++ b/src/lib/core/common-behaviors/disabled.ts @@ -15,8 +15,11 @@ export interface CanDisable { disabled: boolean; } +/** @docs-private */ +export type CanDisableCtor = Constructor; + /** Mixin to augment a directive with a `disabled` property. */ -export function mixinDisabled>(base: T): Constructor & T { +export function mixinDisabled>(base: T): CanDisableCtor & T { return class extends base { private _disabled: boolean = false; diff --git a/src/lib/core/common-behaviors/error-state.ts b/src/lib/core/common-behaviors/error-state.ts index 5d9bbae18a01..a5514fb6105e 100644 --- a/src/lib/core/common-behaviors/error-state.ts +++ b/src/lib/core/common-behaviors/error-state.ts @@ -6,10 +6,11 @@ * found in the LICENSE file at https://angular.io/license */ -import {Constructor} from './constructor'; -import {ErrorStateMatcher} from '../error/error-options'; import {FormControl, FormGroupDirective, NgControl, NgForm} from '@angular/forms'; import {Subject} from 'rxjs'; +import {ErrorStateMatcher} from '../error/error-options'; +import {Constructor} from './constructor'; + /** @docs-private */ export interface CanUpdateErrorState { @@ -19,6 +20,9 @@ export interface CanUpdateErrorState { errorStateMatcher: ErrorStateMatcher; } +/** @docs-private */ +export type CanUpdateErrorStateCtor = Constructor; + /** @docs-private */ export interface HasErrorState { _parentFormGroup: FormGroupDirective; @@ -32,7 +36,7 @@ export interface HasErrorState { * For component with `errorState` and need to update `errorState`. */ export function mixinErrorState>(base: T) -: Constructor & T { +: CanUpdateErrorStateCtor & T { return class extends base { /** Whether the component is in an error state. */ errorState: boolean = false; diff --git a/src/lib/core/common-behaviors/index.ts b/src/lib/core/common-behaviors/index.ts index 5e963bda2d85..e6e014408be0 100644 --- a/src/lib/core/common-behaviors/index.ts +++ b/src/lib/core/common-behaviors/index.ts @@ -7,9 +7,9 @@ */ export {MatCommonModule, MATERIAL_SANITY_CHECKS} from './common-module'; -export {CanDisable, mixinDisabled} from './disabled'; -export {CanColor, mixinColor, ThemePalette} from './color'; -export {CanDisableRipple, mixinDisableRipple} from './disable-ripple'; -export {HasTabIndex, mixinTabIndex} from './tabindex'; -export {CanUpdateErrorState, mixinErrorState} from './error-state'; -export {HasInitialized, mixinInitialized} from './initialized'; +export {CanDisable, CanDisableCtor, mixinDisabled} from './disabled'; +export {CanColor, CanColorCtor, mixinColor, ThemePalette} from './color'; +export {CanDisableRipple, CanDisableRippleCtor, mixinDisableRipple} from './disable-ripple'; +export {HasTabIndex, HasTabIndexCtor, mixinTabIndex} from './tabindex'; +export {CanUpdateErrorState, CanUpdateErrorStateCtor, mixinErrorState} from './error-state'; +export {HasInitialized, HasInitializedCtor, mixinInitialized} from './initialized'; diff --git a/src/lib/core/common-behaviors/initialized.ts b/src/lib/core/common-behaviors/initialized.ts index 819cfd14e039..9052ee351e86 100644 --- a/src/lib/core/common-behaviors/initialized.ts +++ b/src/lib/core/common-behaviors/initialized.ts @@ -29,9 +29,12 @@ export interface HasInitialized { _markInitialized: () => void; } +/** @docs-private */ +export type HasInitializedCtor = Constructor; + /** Mixin to augment a directive with an initialized property that will emits when ngOnInit ends. */ export function mixinInitialized>(base: T): - Constructor & T { + HasInitializedCtor & T { return class extends base { /** Whether this directive has been marked as initialized. */ _isInitialized = false; diff --git a/src/lib/core/common-behaviors/tabindex.ts b/src/lib/core/common-behaviors/tabindex.ts index c5709beb4abe..264394eda0ab 100644 --- a/src/lib/core/common-behaviors/tabindex.ts +++ b/src/lib/core/common-behaviors/tabindex.ts @@ -9,15 +9,19 @@ import {Constructor} from './constructor'; import {CanDisable} from './disabled'; + /** @docs-private */ export interface HasTabIndex { /** Tabindex of the component. */ tabIndex: number; } +/** @docs-private */ +export type HasTabIndexCtor = Constructor; + /** Mixin to augment a directive with a `tabIndex` property. */ export function mixinTabIndex>(base: T, defaultTabIndex = 0) - : Constructor & T { + : HasTabIndexCtor & T { return class extends base { private _tabIndex: number = defaultTabIndex; diff --git a/src/lib/core/option/optgroup.ts b/src/lib/core/option/optgroup.ts index 42a03976e79f..8acfd0c33fdc 100644 --- a/src/lib/core/option/optgroup.ts +++ b/src/lib/core/option/optgroup.ts @@ -6,13 +6,15 @@ * found in the LICENSE file at https://angular.io/license */ -import {Component, ViewEncapsulation, Input, ChangeDetectionStrategy} from '@angular/core'; -import {mixinDisabled, CanDisable} from '../common-behaviors/disabled'; +import {ChangeDetectionStrategy, Component, Input, ViewEncapsulation} from '@angular/core'; +import {CanDisable, CanDisableCtor, mixinDisabled} from '../common-behaviors/disabled'; + // Boilerplate for applying mixins to MatOptgroup. /** @docs-private */ export class MatOptgroupBase { } -export const _MatOptgroupMixinBase = mixinDisabled(MatOptgroupBase); +export const _MatOptgroupMixinBase: CanDisableCtor & typeof MatOptgroupBase = + mixinDisabled(MatOptgroupBase); // Counter for unique group ids. let _uniqueOptgroupIdCounter = 0; diff --git a/src/lib/datepicker/datepicker-input.ts b/src/lib/datepicker/datepicker-input.ts index f4fed4ded6ab..1eccd662f093 100644 --- a/src/lib/datepicker/datepicker-input.ts +++ b/src/lib/datepicker/datepicker-input.ts @@ -27,9 +27,9 @@ import { ValidationErrors, Validator, ValidatorFn, - Validators + Validators, } from '@angular/forms'; -import {DateAdapter, MAT_DATE_FORMATS, MatDateFormats} from '@angular/material/core'; +import {DateAdapter, MAT_DATE_FORMATS, MatDateFormats, ThemePalette} from '@angular/material/core'; import {MatFormField} from '@angular/material/form-field'; import {MAT_INPUT_VALUE_ACCESSOR} from '@angular/material/input'; import {Subscription} from 'rxjs'; @@ -335,7 +335,7 @@ export class MatDatepickerInput implements ControlValueAccessor, OnDestroy, V } /** Returns the palette used by the input's form field, if any. */ - _getThemePalette() { + _getThemePalette(): ThemePalette { return this._formField ? this._formField.color : undefined; } diff --git a/src/lib/datepicker/datepicker.ts b/src/lib/datepicker/datepicker.ts index a3893797b785..cd3875e69140 100644 --- a/src/lib/datepicker/datepicker.ts +++ b/src/lib/datepicker/datepicker.ts @@ -18,7 +18,6 @@ import { } from '@angular/cdk/overlay'; import {ComponentPortal, ComponentType} from '@angular/cdk/portal'; import {DOCUMENT} from '@angular/common'; -import {take, filter} from 'rxjs/operators'; import { AfterViewInit, ChangeDetectionStrategy, @@ -30,20 +29,27 @@ import { InjectionToken, Input, NgZone, + OnDestroy, Optional, Output, ViewChild, ViewContainerRef, ViewEncapsulation, - OnDestroy, } from '@angular/core'; -import {CanColor, DateAdapter, mixinColor, ThemePalette} from '@angular/material/core'; +import { + CanColor, + CanColorCtor, + DateAdapter, + mixinColor, + ThemePalette, +} from '@angular/material/core'; import {MatDialog, MatDialogRef} from '@angular/material/dialog'; import {merge, Subject, Subscription} from 'rxjs'; -import {createMissingDateImplError} from './datepicker-errors'; -import {MatDatepickerInput} from './datepicker-input'; +import {filter, take} from 'rxjs/operators'; import {MatCalendar} from './calendar'; import {matDatepickerAnimations} from './datepicker-animations'; +import {createMissingDateImplError} from './datepicker-errors'; +import {MatDatepickerInput} from './datepicker-input'; /** Used to generate a unique ID for each datepicker instance. */ let datepickerUid = 0; @@ -69,7 +75,8 @@ export const MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER = { export class MatDatepickerContentBase { constructor(public _elementRef: ElementRef) { } } -export const _MatDatepickerContentMixinBase = mixinColor(MatDatepickerContentBase); +export const _MatDatepickerContentMixinBase: CanColorCtor & typeof MatDatepickerContentBase = + mixinColor(MatDatepickerContentBase); /** * Component used as the content for the datepicker dialog and popup. We use this instead of using diff --git a/src/lib/form-field/form-field.ts b/src/lib/form-field/form-field.ts index eb4c9d02491d..b301990153ea 100644 --- a/src/lib/form-field/form-field.ts +++ b/src/lib/form-field/form-field.ts @@ -28,7 +28,7 @@ import { ViewEncapsulation, } from '@angular/core'; import { - CanColor, + CanColor, CanColorCtor, FloatLabelType, LabelOptions, MAT_LABEL_GLOBAL_OPTIONS, @@ -70,7 +70,8 @@ export class MatFormFieldBase { * Base class to which we're applying the form field mixins. * @docs-private */ -export const _MatFormFieldMixinBase = mixinColor(MatFormFieldBase, 'primary'); +export const _MatFormFieldMixinBase: CanColorCtor & typeof MatFormFieldBase = + mixinColor(MatFormFieldBase, 'primary'); /** Possible appearance styles for the form field. */ export type MatFormFieldAppearance = 'legacy' | 'standard' | 'fill' | 'outline'; diff --git a/src/lib/icon/icon.ts b/src/lib/icon/icon.ts index fcfe0012861f..2c5f67d554ef 100644 --- a/src/lib/icon/icon.ts +++ b/src/lib/icon/icon.ts @@ -18,7 +18,7 @@ import { SimpleChanges, ViewEncapsulation, } from '@angular/core'; -import {CanColor, mixinColor} from '@angular/material/core'; +import {CanColor, CanColorCtor, mixinColor} from '@angular/material/core'; import {coerceBooleanProperty} from '@angular/cdk/coercion'; import {MatIconRegistry} from './icon-registry'; @@ -28,7 +28,8 @@ import {MatIconRegistry} from './icon-registry'; export class MatIconBase { constructor(public _elementRef: ElementRef) {} } -export const _MatIconMixinBase = mixinColor(MatIconBase); +export const _MatIconMixinBase: CanColorCtor & typeof MatIconBase = + mixinColor(MatIconBase); /** diff --git a/src/lib/input/input.ts b/src/lib/input/input.ts index 5607de0000ff..330dfeb82e7c 100644 --- a/src/lib/input/input.ts +++ b/src/lib/input/input.ts @@ -8,24 +8,29 @@ import {coerceBooleanProperty} from '@angular/cdk/coercion'; import {getSupportedInputTypes, Platform} from '@angular/cdk/platform'; +import {AutofillMonitor} from '@angular/cdk/text-field'; import { Directive, DoCheck, ElementRef, Inject, Input, + NgZone, OnChanges, OnDestroy, OnInit, Optional, Self, - NgZone, } from '@angular/core'; import {FormGroupDirective, NgControl, NgForm} from '@angular/forms'; -import {CanUpdateErrorState, ErrorStateMatcher, mixinErrorState} from '@angular/material/core'; +import { + CanUpdateErrorState, + CanUpdateErrorStateCtor, + ErrorStateMatcher, + mixinErrorState, +} from '@angular/material/core'; import {MatFormFieldControl} from '@angular/material/form-field'; import {Subject} from 'rxjs'; -import {AutofillMonitor} from '@angular/cdk/text-field'; import {getMatInputUnsupportedTypeError} from './input-errors'; import {MAT_INPUT_VALUE_ACCESSOR} from './input-value-accessor'; @@ -54,7 +59,8 @@ export class MatInputBase { /** @docs-private */ public ngControl: NgControl) {} } -export const _MatInputMixinBase = mixinErrorState(MatInputBase); +export const _MatInputMixinBase: CanUpdateErrorStateCtor & typeof MatInputBase = + mixinErrorState(MatInputBase); /** Directive that allows a native input to work inside a `MatFormField`. */ @Directive({ diff --git a/src/lib/list/list.ts b/src/lib/list/list.ts index 2d5443c4f86a..7c8d69a73e89 100644 --- a/src/lib/list/list.ts +++ b/src/lib/list/list.ts @@ -18,17 +18,25 @@ import { QueryList, ViewEncapsulation, } from '@angular/core'; -import {CanDisableRipple, MatLine, MatLineSetter, mixinDisableRipple} from '@angular/material/core'; +import { + CanDisableRipple, + CanDisableRippleCtor, + MatLine, + MatLineSetter, + mixinDisableRipple, +} from '@angular/material/core'; // Boilerplate for applying mixins to MatList. /** @docs-private */ export class MatListBase {} -export const _MatListMixinBase = mixinDisableRipple(MatListBase); +export const _MatListMixinBase: CanDisableRippleCtor & typeof MatListBase = + mixinDisableRipple(MatListBase); // Boilerplate for applying mixins to MatListItem. /** @docs-private */ export class MatListItemBase {} -export const _MatListItemMixinBase = mixinDisableRipple(MatListItemBase); +export const _MatListItemMixinBase: CanDisableRippleCtor & typeof MatListItemBase = + mixinDisableRipple(MatListItemBase); @Component({ moduleId: module.id, diff --git a/src/lib/list/selection-list.ts b/src/lib/list/selection-list.ts index 7ebb0805ebc4..f814dc3e44de 100644 --- a/src/lib/list/selection-list.ts +++ b/src/lib/list/selection-list.ts @@ -31,7 +31,7 @@ import { ViewEncapsulation, } from '@angular/core'; import { - CanDisableRipple, + CanDisableRipple, CanDisableRippleCtor, MatLine, MatLineSetter, mixinDisableRipple, @@ -43,11 +43,13 @@ import {MatListAvatarCssMatStyler} from './list'; /** @docs-private */ export class MatSelectionListBase {} -export const _MatSelectionListMixinBase = mixinDisableRipple(MatSelectionListBase); +export const _MatSelectionListMixinBase: CanDisableRippleCtor & typeof MatSelectionListBase = + mixinDisableRipple(MatSelectionListBase); /** @docs-private */ export class MatListOptionBase {} -export const _MatListOptionMixinBase = mixinDisableRipple(MatListOptionBase); +export const _MatListOptionMixinBase: CanDisableRippleCtor & typeof MatListOptionBase = + mixinDisableRipple(MatListOptionBase); /** @docs-private */ export const MAT_SELECTION_LIST_VALUE_ACCESSOR: any = { diff --git a/src/lib/menu/menu-item.ts b/src/lib/menu/menu-item.ts index b6515607c7ab..2457e16eded5 100644 --- a/src/lib/menu/menu-item.ts +++ b/src/lib/menu/menu-item.ts @@ -17,10 +17,10 @@ import { Optional, } from '@angular/core'; import { - CanDisable, - CanDisableRipple, + CanDisable, CanDisableCtor, + CanDisableRipple, CanDisableRippleCtor, mixinDisabled, - mixinDisableRipple + mixinDisableRipple, } from '@angular/material/core'; import {Subject} from 'rxjs'; import {DOCUMENT} from '@angular/common'; @@ -29,7 +29,8 @@ import {MAT_MENU_PANEL, MatMenuPanel} from './menu-panel'; // Boilerplate for applying mixins to MatMenuItem. /** @docs-private */ export class MatMenuItemBase {} -export const _MatMenuItemMixinBase = mixinDisableRipple(mixinDisabled(MatMenuItemBase)); +export const _MatMenuItemMixinBase: CanDisableRippleCtor & CanDisableCtor & typeof MatMenuItemBase = + mixinDisableRipple(mixinDisabled(MatMenuItemBase)); /** * This directive is intended to be used inside an mat-menu tag. diff --git a/src/lib/paginator/paginator.ts b/src/lib/paginator/paginator.ts index 2c4acf19f1f6..8e64a790e5c3 100644 --- a/src/lib/paginator/paginator.ts +++ b/src/lib/paginator/paginator.ts @@ -20,7 +20,12 @@ import { } from '@angular/core'; import {Subscription} from 'rxjs'; import {MatPaginatorIntl} from './paginator-intl'; -import {HasInitialized, mixinInitialized, ThemePalette} from '@angular/material/core'; +import { + HasInitialized, + HasInitializedCtor, + mixinInitialized, + ThemePalette, +} from '@angular/material/core'; /** The default page size if there is no page size and there are no provided page size options. */ const DEFAULT_PAGE_SIZE = 50; @@ -49,7 +54,8 @@ export class PageEvent { // Boilerplate for applying mixins to MatPaginator. /** @docs-private */ export class MatPaginatorBase {} -export const _MatPaginatorBase = mixinInitialized(MatPaginatorBase); +export const _MatPaginatorBase: HasInitializedCtor & typeof MatPaginatorBase = + mixinInitialized(MatPaginatorBase); /** * Component to provide navigation between paged information. Displays the size of the current diff --git a/src/lib/progress-bar/progress-bar.ts b/src/lib/progress-bar/progress-bar.ts index 122995d7640e..1dfb0b265948 100644 --- a/src/lib/progress-bar/progress-bar.ts +++ b/src/lib/progress-bar/progress-bar.ts @@ -25,7 +25,7 @@ import { import {fromEvent, Subscription} from 'rxjs'; import {filter} from 'rxjs/operators'; import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations'; -import {CanColor, mixinColor} from '@angular/material/core'; +import {CanColor, CanColorCtor, mixinColor} from '@angular/material/core'; import {DOCUMENT} from '@angular/common'; // TODO(josephperrott): Benchpress tests. @@ -42,7 +42,8 @@ export interface ProgressAnimationEnd { value: number; } -export const _MatProgressBarMixinBase = mixinColor(MatProgressBarBase, 'primary'); +export const _MatProgressBarMixinBase: CanColorCtor & typeof MatProgressBarBase = + mixinColor(MatProgressBarBase, 'primary'); /** * Injection token used to provide the current location to `MatProgressBar`. diff --git a/src/lib/progress-spinner/progress-spinner.ts b/src/lib/progress-spinner/progress-spinner.ts index 4e65b232d7f1..13c29e76c399 100644 --- a/src/lib/progress-spinner/progress-spinner.ts +++ b/src/lib/progress-spinner/progress-spinner.ts @@ -6,21 +6,22 @@ * found in the LICENSE file at https://angular.io/license */ +import {coerceNumberProperty} from '@angular/cdk/coercion'; +import {Platform} from '@angular/cdk/platform'; +import {DOCUMENT} from '@angular/common'; import { - Component, ChangeDetectionStrategy, + Component, + ElementRef, Inject, + InjectionToken, Input, - ElementRef, - ViewEncapsulation, Optional, - InjectionToken, + ViewEncapsulation, } from '@angular/core'; +import {CanColor, CanColorCtor, mixinColor} from '@angular/material/core'; import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations'; -import {CanColor, mixinColor} from '@angular/material/core'; -import {Platform} from '@angular/cdk/platform'; -import {DOCUMENT} from '@angular/common'; -import {coerceNumberProperty} from '@angular/cdk/coercion'; + /** Possible mode for a progress spinner. */ export type ProgressSpinnerMode = 'determinate' | 'indeterminate'; @@ -42,7 +43,8 @@ const BASE_STROKE_WIDTH = 10; export class MatProgressSpinnerBase { constructor(public _elementRef: ElementRef) {} } -export const _MatProgressSpinnerMixinBase = mixinColor(MatProgressSpinnerBase, 'primary'); +export const _MatProgressSpinnerMixinBase: CanColorCtor & typeof MatProgressSpinnerBase = + mixinColor(MatProgressSpinnerBase, 'primary'); /** Default `mat-progress-spinner` options that can be overridden. */ export interface MatProgressSpinnerDefaultOptions { diff --git a/src/lib/radio/radio.ts b/src/lib/radio/radio.ts index 085232194329..2569fa56b0a3 100644 --- a/src/lib/radio/radio.ts +++ b/src/lib/radio/radio.ts @@ -20,6 +20,7 @@ import { ElementRef, EventEmitter, forwardRef, + Inject, Input, OnDestroy, OnInit, @@ -28,14 +29,17 @@ import { QueryList, ViewChild, ViewEncapsulation, - Inject, } from '@angular/core'; import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; import { CanColor, + CanColorCtor, CanDisable, + CanDisableCtor, CanDisableRipple, + CanDisableRippleCtor, HasTabIndex, + HasTabIndexCtor, mixinColor, mixinDisabled, mixinDisableRipple, @@ -71,7 +75,8 @@ export class MatRadioChange { // Boilerplate for applying mixins to MatRadioGroup. /** @docs-private */ export class MatRadioGroupBase { } -export const _MatRadioGroupMixinBase = mixinDisabled(MatRadioGroupBase); +export const _MatRadioGroupMixinBase: CanDisableCtor & typeof MatRadioGroupBase = + mixinDisabled(MatRadioGroupBase); /** * A group of radio buttons. May contain one or more `` elements. @@ -311,8 +316,9 @@ export class MatRadioButtonBase { } // As per Material design specifications the selection control radio should use the accent color // palette by default. https://material.io/guidelines/components/selection-controls.html -export const _MatRadioButtonMixinBase = - mixinColor(mixinDisableRipple(mixinTabIndex(MatRadioButtonBase)), 'accent'); +export const _MatRadioButtonMixinBase: + CanColorCtor & CanDisableRippleCtor & HasTabIndexCtor & typeof MatRadioButtonBase = + mixinColor(mixinDisableRipple(mixinTabIndex(MatRadioButtonBase)), 'accent'); /** * A Material design radio-button. Typically placed inside of `` elements. diff --git a/src/lib/schematics/update/material/typescript-specifiers.ts b/src/lib/schematics/update/material/typescript-specifiers.ts index 94e4fd138aff..c9a87fce29c4 100644 --- a/src/lib/schematics/update/material/typescript-specifiers.ts +++ b/src/lib/schematics/update/material/typescript-specifiers.ts @@ -27,10 +27,6 @@ export function isMaterialExportDeclaration(node: ts.Node) { /** Whether the declaration is part of Angular Material. */ function isMaterialDeclaration(declaration: ts.ImportDeclaration | ts.ExportDeclaration) { - if (!declaration.moduleSpecifier) { - return false; - } - const moduleSpecifier = declaration.moduleSpecifier.getText(); return moduleSpecifier.indexOf(materialModuleSpecifier) !== -1 || moduleSpecifier.indexOf(cdkModuleSpecifier) !== -1; diff --git a/src/lib/schematics/update/rules/checkImportMiscRule.ts b/src/lib/schematics/update/rules/checkImportMiscRule.ts index 0abaf64c2928..a209f8665347 100644 --- a/src/lib/schematics/update/rules/checkImportMiscRule.ts +++ b/src/lib/schematics/update/rules/checkImportMiscRule.ts @@ -12,43 +12,26 @@ import * as ts from 'typescript'; import {isMaterialImportDeclaration} from '../material/typescript-specifiers'; /** - * Rule that detects import declarations that refer to outdated identifiers from Angular Material - * or the CDK which cannot be updated automatically. + * Rule that walks through every identifier that is part of Angular Material and replaces the + * outdated name with the new one. */ export class Rule extends Rules.TypedRule { applyWithProgram(sourceFile: ts.SourceFile, program: ts.Program): RuleFailure[] { - return this.applyWithWalker(new Walker(sourceFile, this.getOptions(), program)); + return this.applyWithWalker(new CheckImportMiscWalker(sourceFile, this.getOptions(), program)); } } -export class Walker extends ProgramAwareRuleWalker { - - visitImportDeclaration(node: ts.ImportDeclaration) { - if (!isMaterialImportDeclaration(node) || - !node.importClause || - !node.importClause.namedBindings) { - return; - } - - const namedBindings = node.importClause.namedBindings; - - if (ts.isNamedImports(namedBindings)) { - this._checkAnimationConstants(namedBindings); +export class CheckImportMiscWalker extends ProgramAwareRuleWalker { + visitImportDeclaration(declaration: ts.ImportDeclaration) { + if (isMaterialImportDeclaration(declaration)) { + declaration.importClause.namedBindings.forEachChild(n => { + let importName = n.getFirstToken() && n.getFirstToken().getText(); + if (importName === 'SHOW_ANIMATION' || importName === 'HIDE_ANIMATION') { + this.addFailureAtNode( + n, + `Found deprecated symbol "${red(importName)}" which has been removed`); + } + }); } } - - /** - * Checks for named imports that refer to the deleted animation constants. - * https://github.com/angular/material2/commit/9f3bf274c4f15f0b0fbd8ab7dbf1a453076e66d9 - */ - private _checkAnimationConstants(namedImports: ts.NamedImports) { - namedImports.elements.filter(element => ts.isIdentifier(element.name)).forEach(element => { - const importName = element.name.text; - - if (importName === 'SHOW_ANIMATION' || importName === 'HIDE_ANIMATION') { - this.addFailureAtNode(element, - `Found deprecated symbol "${red(importName)}" which has been removed`); - } - }); - } } diff --git a/src/lib/select/select.ts b/src/lib/select/select.ts index b786af237e53..6216b8a03080 100644 --- a/src/lib/select/select.ts +++ b/src/lib/select/select.ts @@ -11,6 +11,7 @@ import {Directionality} from '@angular/cdk/bidi'; import {coerceBooleanProperty} from '@angular/cdk/coercion'; import {SelectionModel} from '@angular/cdk/collections'; import { + A, DOWN_ARROW, END, ENTER, @@ -19,7 +20,6 @@ import { RIGHT_ARROW, SPACE, UP_ARROW, - A, } from '@angular/cdk/keycodes'; import { CdkConnectedOverlay, @@ -61,10 +61,14 @@ import { _countGroupLabelsBeforeOption, _getOptionScrollPosition, CanDisable, + CanDisableCtor, CanDisableRipple, + CanDisableRippleCtor, CanUpdateErrorState, + CanUpdateErrorStateCtor, ErrorStateMatcher, HasTabIndex, + HasTabIndexCtor, MAT_OPTION_PARENT_COMPONENT, MatOptgroup, MatOption, @@ -77,13 +81,13 @@ import { import {MatFormField, MatFormFieldControl} from '@angular/material/form-field'; import {defer, merge, Observable, Subject} from 'rxjs'; import { + distinctUntilChanged, filter, map, startWith, switchMap, take, takeUntil, - distinctUntilChanged, } from 'rxjs/operators'; import {matSelectAnimations} from './select-animations'; import { @@ -164,8 +168,13 @@ export class MatSelectBase { public _parentFormGroup: FormGroupDirective, public ngControl: NgControl) {} } -export const _MatSelectMixinBase = mixinDisableRipple( - mixinTabIndex(mixinDisabled(mixinErrorState(MatSelectBase)))); +export const _MatSelectMixinBase: + CanDisableCtor & + HasTabIndexCtor & + CanDisableRippleCtor & + CanUpdateErrorStateCtor & + typeof MatSelectBase = + mixinDisableRipple(mixinTabIndex(mixinDisabled(mixinErrorState(MatSelectBase)))); /** diff --git a/src/lib/slide-toggle/slide-toggle.ts b/src/lib/slide-toggle/slide-toggle.ts index cf4254df85c7..ca9677baa3ea 100644 --- a/src/lib/slide-toggle/slide-toggle.ts +++ b/src/lib/slide-toggle/slide-toggle.ts @@ -30,11 +30,11 @@ import { } from '@angular/core'; import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; import { - CanColor, - CanDisable, - CanDisableRipple, + CanColor, CanColorCtor, + CanDisable, CanDisableCtor, + CanDisableRipple, CanDisableRippleCtor, HammerInput, - HasTabIndex, + HasTabIndex, HasTabIndexCtor, mixinColor, mixinDisabled, mixinDisableRipple, @@ -69,8 +69,13 @@ export class MatSlideToggleChange { export class MatSlideToggleBase { constructor(public _elementRef: ElementRef) {} } -export const _MatSlideToggleMixinBase = - mixinTabIndex(mixinColor(mixinDisableRipple(mixinDisabled(MatSlideToggleBase)), 'accent')); +export const _MatSlideToggleMixinBase: + HasTabIndexCtor & + CanColorCtor & + CanDisableRippleCtor & + CanDisableCtor & + typeof MatSlideToggleBase = + mixinTabIndex(mixinColor(mixinDisableRipple(mixinDisabled(MatSlideToggleBase)), 'accent')); /** Represents a slidable "switch" toggle that can be moved between on and off. */ @Component({ diff --git a/src/lib/slider/slider.ts b/src/lib/slider/slider.ts index b2c3ee2fc86a..780188303b3e 100644 --- a/src/lib/slider/slider.ts +++ b/src/lib/slider/slider.ts @@ -27,6 +27,7 @@ import { ElementRef, EventEmitter, forwardRef, + Inject, Input, OnDestroy, OnInit, @@ -34,20 +35,22 @@ import { Output, ViewChild, ViewEncapsulation, - Inject, } from '@angular/core'; import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms'; import { CanColor, + CanColorCtor, CanDisable, + CanDisableCtor, HammerInput, HasTabIndex, + HasTabIndexCtor, mixinColor, mixinDisabled, mixinTabIndex, } from '@angular/material/core'; -import {Subscription} from 'rxjs'; import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations'; +import {Subscription} from 'rxjs'; /** * Visually, a 30px separation between tick marks looks best. This is very subjective but it is @@ -89,8 +92,12 @@ export class MatSliderChange { export class MatSliderBase { constructor(public _elementRef: ElementRef) {} } -export const _MatSliderMixinBase = - mixinTabIndex(mixinColor(mixinDisabled(MatSliderBase), 'accent')); +export const _MatSliderMixinBase: + HasTabIndexCtor & + CanColorCtor & + CanDisableCtor & + typeof MatSliderBase = + mixinTabIndex(mixinColor(mixinDisabled(MatSliderBase), 'accent')); /** * Allows users to select from a range of values by moving the slider thumb. It is similar in diff --git a/src/lib/sort/sort-header.ts b/src/lib/sort/sort-header.ts index 7ca279dcdecc..a6d93b0277e6 100644 --- a/src/lib/sort/sort-header.ts +++ b/src/lib/sort/sort-header.ts @@ -16,9 +16,9 @@ import { OnDestroy, OnInit, Optional, - ViewEncapsulation + ViewEncapsulation, } from '@angular/core'; -import {CanDisable, mixinDisabled} from '@angular/material/core'; +import {CanDisable, CanDisableCtor, mixinDisabled} from '@angular/material/core'; import {merge, Subscription} from 'rxjs'; import {MatSort, MatSortable} from './sort'; import {matSortAnimations} from './sort-animations'; @@ -30,7 +30,8 @@ import {MatSortHeaderIntl} from './sort-header-intl'; // Boilerplate for applying mixins to the sort header. /** @docs-private */ export class MatSortHeaderBase {} -export const _MatSortHeaderMixinBase = mixinDisabled(MatSortHeaderBase); +export const _MatSortHeaderMixinBase: CanDisableCtor & typeof MatSortHeaderBase = + mixinDisabled(MatSortHeaderBase); /** * Valid positions for the arrow to be in for its opacity and translation. If the state is a diff --git a/src/lib/sort/sort.ts b/src/lib/sort/sort.ts index af0dc267c495..2c4167b80b98 100644 --- a/src/lib/sort/sort.ts +++ b/src/lib/sort/sort.ts @@ -6,6 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ +import {coerceBooleanProperty} from '@angular/cdk/coercion'; import { Directive, EventEmitter, @@ -16,15 +17,21 @@ import { OnInit, Output, } from '@angular/core'; -import {coerceBooleanProperty} from '@angular/cdk/coercion'; -import {CanDisable, HasInitialized, mixinDisabled, mixinInitialized} from '@angular/material/core'; +import { + CanDisable, + CanDisableCtor, + HasInitialized, + HasInitializedCtor, + mixinDisabled, + mixinInitialized, +} from '@angular/material/core'; +import {Subject} from 'rxjs'; import {SortDirection} from './sort-direction'; import { getSortDuplicateSortableIdError, getSortHeaderMissingIdError, - getSortInvalidDirectionError + getSortInvalidDirectionError, } from './sort-errors'; -import {Subject} from 'rxjs'; /** Interface for a directive that holds sorting state consumed by `MatSortHeader`. */ export interface MatSortable { @@ -50,7 +57,8 @@ export interface Sort { // Boilerplate for applying mixins to MatSort. /** @docs-private */ export class MatSortBase {} -export const _MatSortMixinBase = mixinInitialized(mixinDisabled(MatSortBase)); +export const _MatSortMixinBase: HasInitializedCtor & CanDisableCtor & typeof MatSortBase = + mixinInitialized(mixinDisabled(MatSortBase)); /** Container for MatSortables to manage the sort state and provide default sort parameters. */ @Directive({ diff --git a/src/lib/tabs/tab-group.ts b/src/lib/tabs/tab-group.ts index 5cdbbd9f50c1..0d1303c8feb4 100644 --- a/src/lib/tabs/tab-group.ts +++ b/src/lib/tabs/tab-group.ts @@ -25,10 +25,12 @@ import { } from '@angular/core'; import { CanColor, + CanColorCtor, CanDisableRipple, + CanDisableRippleCtor, mixinColor, mixinDisableRipple, - ThemePalette + ThemePalette, } from '@angular/material/core'; import {merge, Subscription} from 'rxjs'; import {MatTab} from './tab'; @@ -54,7 +56,8 @@ export type MatTabHeaderPosition = 'above' | 'below'; export class MatTabGroupBase { constructor(public _elementRef: ElementRef) {} } -export const _MatTabGroupMixinBase = mixinColor(mixinDisableRipple(MatTabGroupBase), 'primary'); +export const _MatTabGroupMixinBase: CanColorCtor & CanDisableRippleCtor & typeof MatTabGroupBase = + mixinColor(mixinDisableRipple(MatTabGroupBase), 'primary'); /** * Material design tab-group component. Supports basic tab pairs (label + content) and includes diff --git a/src/lib/tabs/tab-header.ts b/src/lib/tabs/tab-header.ts index 402c75a6a034..cd930500c6a8 100644 --- a/src/lib/tabs/tab-header.ts +++ b/src/lib/tabs/tab-header.ts @@ -27,7 +27,7 @@ import { ViewChild, ViewEncapsulation, } from '@angular/core'; -import {CanDisableRipple, mixinDisableRipple} from '@angular/material/core'; +import {CanDisableRipple, CanDisableRippleCtor, mixinDisableRipple} from '@angular/material/core'; import {merge, of as observableOf, Subject} from 'rxjs'; import {takeUntil} from 'rxjs/operators'; import {MatInkBar} from './ink-bar'; @@ -51,7 +51,8 @@ const EXAGGERATED_OVERSCROLL = 60; // Boilerplate for applying mixins to MatTabHeader. /** @docs-private */ export class MatTabHeaderBase {} -export const _MatTabHeaderMixinBase = mixinDisableRipple(MatTabHeaderBase); +export const _MatTabHeaderMixinBase: CanDisableRippleCtor & typeof MatTabHeaderBase = + mixinDisableRipple(MatTabHeaderBase); /** * The header of the tab group which displays a list of all the tabs in the tab group. Includes diff --git a/src/lib/tabs/tab-label-wrapper.ts b/src/lib/tabs/tab-label-wrapper.ts index 09f54ba833fb..0240b8f734c6 100644 --- a/src/lib/tabs/tab-label-wrapper.ts +++ b/src/lib/tabs/tab-label-wrapper.ts @@ -7,12 +7,14 @@ */ import {Directive, ElementRef} from '@angular/core'; -import {CanDisable, mixinDisabled} from '@angular/material/core'; +import {CanDisable, CanDisableCtor, mixinDisabled} from '@angular/material/core'; + // Boilerplate for applying mixins to MatTabLabelWrapper. /** @docs-private */ export class MatTabLabelWrapperBase {} -export const _MatTabLabelWrapperMixinBase = mixinDisabled(MatTabLabelWrapperBase); +export const _MatTabLabelWrapperMixinBase: CanDisableCtor & typeof MatTabLabelWrapperBase = + mixinDisabled(MatTabLabelWrapperBase); /** * Used in the `mat-tab-group` view to display tab labels. diff --git a/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts b/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts index a766077afe14..449b318248b9 100644 --- a/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts +++ b/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts @@ -29,10 +29,10 @@ import { ViewEncapsulation, } from '@angular/core'; import { - CanColor, - CanDisable, - CanDisableRipple, - HasTabIndex, + CanColor, CanColorCtor, + CanDisable, CanDisableCtor, + CanDisableRipple, CanDisableRippleCtor, + HasTabIndex, HasTabIndexCtor, MAT_RIPPLE_GLOBAL_OPTIONS, mixinColor, mixinDisabled, @@ -54,7 +54,8 @@ import {FocusMonitor} from '@angular/cdk/a11y'; export class MatTabNavBase { constructor(public _elementRef: ElementRef) {} } -export const _MatTabNavMixinBase = mixinDisableRipple(mixinColor(MatTabNavBase, 'primary')); +export const _MatTabNavMixinBase: CanDisableRippleCtor & CanColorCtor & typeof MatTabNavBase = + mixinDisableRipple(mixinColor(MatTabNavBase, 'primary')); /** * Navigation component matching the styles of the tab group header. @@ -161,8 +162,9 @@ export class MatTabNav extends _MatTabNavMixinBase // Boilerplate for applying mixins to MatTabLink. export class MatTabLinkBase {} -export const _MatTabLinkMixinBase = - mixinTabIndex(mixinDisableRipple(mixinDisabled(MatTabLinkBase))); +export const _MatTabLinkMixinBase: + HasTabIndexCtor & CanDisableRippleCtor & CanDisableCtor & typeof MatTabLinkBase = + mixinTabIndex(mixinDisableRipple(mixinDisabled(MatTabLinkBase))); /** * Link inside of a `mat-tab-nav-bar`. diff --git a/src/lib/tabs/tab.ts b/src/lib/tabs/tab.ts index 25f2ee225ffa..f8d41a990ec2 100644 --- a/src/lib/tabs/tab.ts +++ b/src/lib/tabs/tab.ts @@ -21,16 +21,17 @@ import { ViewContainerRef, ViewEncapsulation, } from '@angular/core'; -import {CanDisable, mixinDisabled} from '@angular/material/core'; +import {CanDisable, CanDisableCtor, mixinDisabled} from '@angular/material/core'; import {Subject} from 'rxjs'; -import {MatTabLabel} from './tab-label'; import {MatTabContent} from './tab-content'; +import {MatTabLabel} from './tab-label'; // Boilerplate for applying mixins to MatTab. /** @docs-private */ export class MatTabBase {} -export const _MatTabMixinBase = mixinDisabled(MatTabBase); +export const _MatTabMixinBase: CanDisableCtor & typeof MatTabBase = + mixinDisabled(MatTabBase); @Component({ moduleId: module.id, diff --git a/src/lib/toolbar/toolbar.ts b/src/lib/toolbar/toolbar.ts index 1cb22d7c3b74..ff998613a91e 100644 --- a/src/lib/toolbar/toolbar.ts +++ b/src/lib/toolbar/toolbar.ts @@ -6,6 +6,8 @@ * found in the LICENSE file at https://angular.io/license */ +import {Platform} from '@angular/cdk/platform'; +import {DOCUMENT} from '@angular/common'; import { AfterViewInit, ChangeDetectionStrategy, @@ -13,21 +15,21 @@ import { ContentChildren, Directive, ElementRef, + Inject, isDevMode, QueryList, ViewEncapsulation, - Inject, } from '@angular/core'; -import {CanColor, mixinColor} from '@angular/material/core'; -import {Platform} from '@angular/cdk/platform'; -import {DOCUMENT} from '@angular/common'; +import {CanColor, CanColorCtor, mixinColor} from '@angular/material/core'; + // Boilerplate for applying mixins to MatToolbar. /** @docs-private */ export class MatToolbarBase { constructor(public _elementRef: ElementRef) {} } -export const _MatToolbarMixinBase = mixinColor(MatToolbarBase); +export const _MatToolbarMixinBase: CanColorCtor & typeof MatToolbarBase = + mixinColor(MatToolbarBase); @Directive({ selector: 'mat-toolbar-row', diff --git a/src/lib/tree/node.ts b/src/lib/tree/node.ts index bffa4240dfa9..eba690fca66b 100644 --- a/src/lib/tree/node.ts +++ b/src/lib/tree/node.ts @@ -18,14 +18,24 @@ import { OnDestroy, QueryList, } from '@angular/core'; -import {CanDisable, HasTabIndex, mixinDisabled, mixinTabIndex} from '@angular/material/core'; +import { + CanDisable, CanDisableCtor, + HasTabIndex, + HasTabIndexCtor, + mixinDisabled, + mixinTabIndex, +} from '@angular/material/core'; import {MatTreeNodeOutlet} from './outlet'; // TODO(devversion): workaround for https://github.com/angular/material2/issues/12760 export const _CdkTreeNodeDef = CdkTreeNodeDef; -export const _MatTreeNodeMixinBase = mixinTabIndex(mixinDisabled(CdkTreeNode)); -export const _MatNestedTreeNodeMixinBase = mixinTabIndex(mixinDisabled(CdkNestedTreeNode)); +export const _MatTreeNodeMixinBase: HasTabIndexCtor & CanDisableCtor & typeof CdkTreeNode = + mixinTabIndex(mixinDisabled(CdkTreeNode)); + +export const _MatNestedTreeNodeMixinBase: + HasTabIndexCtor & CanDisableCtor & typeof CdkNestedTreeNode = + mixinTabIndex(mixinDisabled(CdkNestedTreeNode)); /** * Wrapper for the CdkTree node with Material design styles.