diff --git a/types/angular-material/angular-material-tests.ts b/types/angular-material/angular-material-tests.ts
index f9195ec999..d1af7c8159 100644
--- a/types/angular-material/angular-material-tests.ts
+++ b/types/angular-material/angular-material-tests.ts
@@ -1,15 +1,12 @@
-
-
-var myApp = angular.module('testModule', ['ngMaterial']);
+const myApp = angular.module('testModule', ['ngMaterial']);
myApp.config((
$mdThemingProvider: ng.material.IThemingProvider,
$mdIconProvider: ng.material.IIconProvider,
$mdProgressCircularProvider: ng.material.IProgressCircularProvider) => {
-
$mdThemingProvider.alwaysWatchTheme(true);
- var neonRedMap: ng.material.IPalette = $mdThemingProvider.extendPalette('red', {
- '500': 'ff0000'
+ const neonRedMap: ng.material.IPalette = $mdThemingProvider.extendPalette('red', {
+ 500: 'ff0000'
});
// Register the new color palette map with the name neonRed
$mdThemingProvider.definePalette('neonRed', neonRedMap);
@@ -21,12 +18,13 @@ myApp.config((
.warnPalette('red')
.dark(true);
- var browserColors: ng.material.IBrowserColors = {
- theme: 'default',
- palette: 'neonRed',
- hue: '500'
+ const browserColors: ng.material.IBrowserColors = {
+ theme: 'default',
+ palette: 'neonRed',
+ hue: '500'
};
- $mdThemingProvider.enableBrowserColor(browserColors);
+ const removeColors = $mdThemingProvider.enableBrowserColor(browserColors);
+ removeColors();
// Disable theming generation at runtime
$mdThemingProvider.disableTheming();
@@ -41,44 +39,67 @@ myApp.config((
$mdProgressCircularProvider.configure({
progressSize: 100,
strokeWidth: 20,
- duration: 800
+ duration: 800,
+ easeFn(t, b, c, d) {
+ t /= d;
+ return c * t * t + b;
+ },
+ easeFnIndeterminate(t, b, c, d) {
+ return c * Math.pow(2, 10 * (t / d - 1)) + b;
+ }
});
});
-myApp.controller('BottomSheetController', ($scope: ng.IScope, $mdBottomSheet: ng.material.IBottomSheetService) => {
+myApp.controller('BottomSheetController', ($scope: ng.IScope, $mdBottomSheet: ng.material.IBottomSheetService, $q: ng.IQService) => {
$scope['openBottomSheet'] = () => {
$mdBottomSheet.show({
template: 'Hello!',
clickOutsideToClose: true,
disableBackdrop: true,
disableParentScroll: false,
- parent: () => {}
});
+
+ const options: ng.material.IBottomSheetOptions = {};
+
+ options.resolve = {
+ nativePromise: () => Promise.resolve(),
+ angularPromise: () => $q.resolve(),
+ annotatedNativePromise: ['fakeService', (fake) => Promise.resolve()],
+ annotatedAngularPromise: ['fakeService', (fake) => $q.resolve()]
+ };
+
+ options.controller = 'TestController';
+ options.controller = (function TestController(param: any) { });
+ options.controller = (class { });
+ options.controller = ['fakeService', function TestController(fake: any) { }];
+ options.controller = ['fakeService', class { }];
+
+ options.parent = (scope, element) => new Element();
+ options.parent = (scope, element) => angular.element(new Element());
+ options.parent = '#container';
+ options.parent = new Element();
+ options.parent = angular.element(new Element());
};
$scope['hideBottomSheet'] = $mdBottomSheet.hide.bind($mdBottomSheet, 'hide');
$scope['cancelBottomSheet'] = $mdBottomSheet.cancel.bind($mdBottomSheet, 'cancel');
});
myApp.controller('ColorController', ($scope: ng.IScope, $mdColor: ng.material.IColorService) => {
- var colorExpression : ng.material.IColorExpression;
- var element : Element;
-
- colorExpression = { color: '#FFFFFF' }
-
- element = new Element();
+ const colorExpression: ng.material.IColorExpression = { color: '#FFFFFF' };
+ const element: Element = new Element();
$scope['applyThemeColors'] = () => {
$mdColor.applyThemeColors(element, colorExpression);
};
$scope['getThemeColor'] = () => {
- $mdColor.getThemeColor('default-neonRed')
+ $mdColor.getThemeColor('default-neonRed');
};
$scope['hasTheme'] = () => {
$mdColor.hasTheme();
};
});
-myApp.controller('DialogController', ($scope: ng.IScope, $mdDialog: ng.material.IDialogService) => {
+myApp.controller('DialogController', ($scope: ng.IScope, $mdDialog: ng.material.IDialogService, $q: ng.IQService) => {
$scope['openDialog'] = () => {
$mdDialog.show({
template: 'Hello!'
@@ -120,16 +141,56 @@ myApp.controller('DialogController', ($scope: ng.IScope, $mdDialog: ng.material.
};
$scope['hideDialog'] = $mdDialog.hide.bind($mdDialog, 'hide');
$scope['cancelDialog'] = $mdDialog.cancel.bind($mdDialog, 'cancel');
+
+ const alertPreset: ng.material.IAlertDialog = $mdDialog.alert()
+ .resolve({
+ nativePromise: () => Promise.resolve(),
+ angularPromise: () => $q.resolve(),
+ annotatedNativePromise: ['fakeService', (fake) => Promise.resolve()],
+ annotatedAngularPromise: ['fakeService', (fake) => $q.resolve()]
+ })
+ .controller('TestController')
+ .controller(function TestController(param) { })
+ .controller(class { })
+ .controller(['fakeService', function TestController(fake) { }])
+ .controller(['fakeService', class { }])
+ ;
+
+ const dialogOptions: ng.material.IDialogOptions = {};
+
+ dialogOptions.resolve = {
+ nativePromise: () => Promise.resolve(),
+ angularPromise: () => $q.resolve(),
+ annotatedNativePromise: ['fakeService', (fake) => Promise.resolve()],
+ annotatedAngularPromise: ['fakeService', (fake) => $q.resolve()]
+ };
+
+ dialogOptions.controller = 'TestController';
+ dialogOptions.controller = (function TestController(param) { });
+ dialogOptions.controller = (class { });
+ dialogOptions.controller = ['fakeService', function TestController(fake) { }];
+ dialogOptions.controller = ['fakeService', class { }];
+
+ $mdDialog.show({
+ onShowing(scope, element) { },
+ onComplete(scope, element) { },
+ onRemoving(element, removePromise) { },
+ });
+
+ $mdDialog.show({
+ onShowing: (scope, element) => { },
+ onComplete: (scope, element) => { },
+ onRemoving: (element, removePromise) => { },
+ });
});
class IconDirective implements ng.IDirective {
-
private $mdIcon: ng.material.IIcon;
constructor($mdIcon: ng.material.IIcon) {
this.$mdIcon = $mdIcon;
}
- public link($scope: ng.IScope, $elm: ng.IAugmentedJQuery) {
+ link($scope: ng.IScope, $elm: ng.IAugmentedJQuery) {
this.$mdIcon('android').then((iconEl: Element) => $elm.append(iconEl));
this.$mdIcon('work:chair').then((iconEl: Element) => $elm.append(iconEl));
// Load and cache the external SVG using a URL
@@ -150,7 +211,7 @@ myApp.controller('MediaController', ($scope: ng.IScope, $mdMedia: ng.material.IM
});
myApp.controller('SidenavController', ($scope: ng.IScope, $mdSidenav: ng.material.ISidenavService) => {
- var componentId = 'left';
+ const componentId = 'left';
$scope['toggle'] = () => $mdSidenav(componentId).toggle();
$scope['open'] = () => $mdSidenav(componentId).open();
$scope['close'] = () => $mdSidenav(componentId).close();
@@ -165,41 +226,81 @@ myApp.controller('SidenavController', ($scope: ng.IScope, $mdSidenav: ng.materia
instance.isLockedOpen();
});
- $scope['onClose'] = $mdSidenav(componentId).onClose(() => {});
+ $scope['onClose'] = $mdSidenav(componentId).onClose(() => { });
});
-myApp.controller('ToastController', ($scope: ng.IScope, $mdToast: ng.material.IToastService) => {
+myApp.controller('ToastController', ($scope: ng.IScope, $mdToast: ng.material.IToastService, $q: ng.IQService) => {
$scope['openToast'] = () => {
$mdToast.show($mdToast.simple().textContent('Hello!'));
$mdToast.updateTextContent('New Content');
- }
+ };
$scope['customToast'] = () => {
- var options = {
+ const options: ng.material.IToastOptions = {
hideDelay: 3000,
position: 'top right',
- controller : 'ToastCtrl',
- templateUrl : 'toast-template.html',
- toastClass: 'my-class'
+ controller: 'ToastCtrl',
+ templateUrl: 'toast-template.html',
+ toastClass: 'my-class',
+ resolve: {
+ nativePromise: () => Promise.resolve(),
+ angularPromise: () => $q.resolve(),
+ annotatedNativePromise: ['fakeService', (fake) => Promise.resolve()],
+ annotatedAngularPromise: ['fakeService', (fake) => $q.resolve()]
+ }
};
+ options.controller = 'TestController';
+ options.controller = (function TestController(param) { });
+ options.controller = (class { });
+ options.controller = ['fakeService', function TestController(fake) { }];
+ options.controller = ['fakeService', class { }];
+
$mdToast.show(options);
- }
+ };
});
-myApp.controller('PanelController', ($scope: ng.IScope, $mdPanel: ng.material.IPanelService) => {
+myApp.controller('PanelController', ($scope: ng.IScope, $mdPanel: ng.material.IPanelService, $q: ng.IQService) => {
$scope['createPanel'] = () => {
- var config = {
+ const config: ng.material.IPanelConfig = {
id: 'myPanel',
template: '
Hello!
',
hasBackdrop: true,
disableParentScroll: true,
- zIndex: 150
+ zIndex: 150,
+ resolve: {
+ nativePromise: () => Promise.resolve(),
+ angularPromise: () => $q.resolve(),
+ annotatedNativePromise: ['fakeService', (fake) => Promise.resolve()],
+ annotatedAngularPromise: ['fakeService', (fake) => $q.resolve()]
+ }
};
-
+
+ config.controller = 'TestController';
+ config.controller = (function TestController(param) { });
+ config.controller = (class { });
+ config.controller = ['fakeService', function TestController(fake) { }];
+ config.controller = ['fakeService', class { }];
+
+ config.onDomAdded = (paneRef) => Promise.resolve();
+ config.onDomAdded = () => $q.reject();
+ config.onDomAdded = () => { };
+
+ config.onOpenComplete = (paneRef) => Promise.resolve();
+ config.onOpenComplete = () => $q.reject();
+ config.onOpenComplete = () => { };
+
+ config.onRemoving = (paneRef) => Promise.resolve();
+ config.onRemoving = () => $q.reject();
+ config.onRemoving = () => { };
+
+ config.onDomRemoved = (paneRef) => Promise.resolve();
+ config.onDomRemoved = () => $q.reject();
+ config.onDomRemoved = () => { };
+
$mdPanel.create(config);
- var panelRef = $mdPanel.create(config);
+ let panelRef = $mdPanel.create(config);
panelRef.open()
.then((ref: ng.material.IPanelRef) => {
ref.addClass('foo');
@@ -232,6 +333,6 @@ myApp.controller('PanelController', ($scope: ng.IScope, $mdPanel: ng.material.IP
$scope['newPanelAnimation'] = () => {
$mdPanel.newPanelAnimation().openFrom('.some-target');
- $mdPanel.newPanelAnimation().openFrom({top: 0, left: 0});
+ $mdPanel.newPanelAnimation().openFrom({ top: 0, left: 0 });
};
});
diff --git a/types/angular-material/index.d.ts b/types/angular-material/index.d.ts
index a8196269a4..5afc9a9153 100644
--- a/types/angular-material/index.d.ts
+++ b/types/angular-material/index.d.ts
@@ -1,4 +1,4 @@
-// Type definitions for Angular Material (angular.material module) 1.1
+// Type definitions for angular-material 1.1
// Project: https://github.com/angular/material
// Definitions by: Blake Bigelow , Peter Hajdu , Davide Donadello , Geert Jansen
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
@@ -9,21 +9,25 @@ declare var _: string;
export = _;
declare module 'angular' {
- export namespace material {
+ namespace material {
+ interface ResolveObject {
+ [name: string]: Injectable<(...args: any[]) => PromiseLike>;
+ }
+
interface IBottomSheetOptions {
templateUrl?: string;
template?: string;
scope?: angular.IScope; // default: new child scope
preserveScope?: boolean; // default: false
- controller?: string | Function;
+ controller?: string | Injectable;
locals?: { [index: string]: any };
clickOutsideToClose?: boolean;
bindToController?: boolean; // default: false
disableBackdrop?: boolean;
escapeToClose?: boolean;
- resolve?: { [index: string]: () => angular.IPromise };
+ resolve?: ResolveObject;
controllerAs?: string;
- parent?: Function | string | Object; // default: root node
+ parent?: ((scope: ng.IScope, element: JQuery) => Element | JQuery) | string | Element | JQuery; // default: root node
disableParentScroll?: boolean; // default: true
}
@@ -49,16 +53,16 @@ declare module 'angular' {
clickOutsideToClose(clickOutsideToClose?: boolean): T; // default: false
escapeToClose(escapeToClose?: boolean): T; // default: true
focusOnOpen(focusOnOpen?: boolean): T; // default: true
- controller(controller?: string | Function): T;
+ controller(controller?: string | Injectable): T;
locals(locals?: { [index: string]: any }): T;
bindToController(bindToController?: boolean): T; // default: false
- resolve(resolve?: { [index: string]: () => angular.IPromise }): T;
+ resolve(resolve?: ResolveObject): T;
controllerAs(controllerAs?: string): T;
parent(parent?: string | Element | JQuery): T; // default: root node
- onComplete(onComplete?: Function): T;
ariaLabel(ariaLabel: string): T;
}
+ // tslint:disable-next-line no-empty-interface
interface IAlertDialog extends IPresetDialog {
}
@@ -97,15 +101,15 @@ declare module 'angular' {
clickOutsideToClose?: boolean; // default: false
escapeToClose?: boolean; // default: true
focusOnOpen?: boolean; // default: true
- controller?: string | Function;
+ controller?: string | Injectable;
locals?: { [index: string]: any };
bindToController?: boolean; // default: false
- resolve?: { [index: string]: () => angular.IPromise }
+ resolve?: ResolveObject;
controllerAs?: string;
parent?: string | Element | JQuery; // default: root node
- onShowing?: Function;
- onComplete?: Function;
- onRemoving?: Function;
+ onShowing?(scope: ng.IScope, element: JQuery): void;
+ onComplete?(scope: ng.IScope, element: JQuery): void;
+ onRemoving?(element: JQuery, removePromise: ng.IPromise): void;
skipHide?: boolean;
multiple?: boolean;
fullscreen?: boolean; // default: false
@@ -120,9 +124,7 @@ declare module 'angular' {
cancel(response?: any): void;
}
- interface IIcon {
- (id: string): angular.IPromise; // id is a unique ID or URL
- }
+ type IIcon = (id: string) => angular.IPromise; // id is a unique ID or URL
interface IIconProvider {
icon(id: string, url: string, viewBoxSize?: number): IIconProvider; // viewBoxSize default: 24
@@ -132,9 +134,7 @@ declare module 'angular' {
defaultFontSet(name: string): IIconProvider;
}
- interface IMedia {
- (media: string): boolean;
- }
+ type IMedia = (media: string) => boolean;
interface ISidenavObject {
toggle(): angular.IPromise;
@@ -142,7 +142,7 @@ declare module 'angular' {
close(): angular.IPromise;
isOpen(): boolean;
isLockedOpen(): boolean;
- onClose(onClose: Function): void;
+ onClose(onClose: () => void): void;
}
interface ISidenavService {
@@ -163,6 +163,7 @@ declare module 'angular' {
toastClass(toastClass: string): T;
}
+ // tslint:disable-next-line no-empty-interface
interface ISimpleToastPreset extends IToastPreset {
}
@@ -175,10 +176,10 @@ declare module 'angular' {
hideDelay?: number | false; // default (ms): 3000
position?: string; // any combination of 'bottom'/'left'/'top'/'right'/'fit'; default: 'bottom left'
toastClass?: string;
- controller?: string | Function;
+ controller?: string | Injectable;
locals?: { [index: string]: any };
bindToController?: boolean; // default: false
- resolve?: { [index: string]: () => angular.IPromise }
+ resolve?: ResolveObject;
controllerAs?: string;
parent?: string | Element | JQuery; // default: root node
}
@@ -263,19 +264,19 @@ declare module 'angular' {
interface IThemeConfig {
disableTheming: boolean;
- generateOnDemand: boolean;
+ generateOnDemand: boolean;
nonce: string;
defaultTheme: string;
alwaysWatchTheme: boolean;
- registeredStyles: Array;
+ registeredStyles: string[];
}
interface IThemingProvider {
alwaysWatchTheme(alwaysWatch: boolean): void;
definePalette(name: string, palette: IPalette): IThemingProvider;
- enableBrowserColor(browserColors: IBrowserColors): Function;
+ enableBrowserColor(browserColors: IBrowserColors): () => void;
extendPalette(name: string, palette: IPalette): IPalette;
- registerStyles(styles: String): void;
+ registerStyles(styles: string): void;
setDefaultTheme(theme: string): void;
setNonce(nonce: string): void;
theme(name: string, inheritFrom?: string): ITheme;
@@ -328,11 +329,11 @@ declare module 'angular' {
id?: string;
template?: string;
templateUrl?: string;
- controller?: string | Function;
+ controller?: string | Injectable;
controllerAs?: string;
bindToController?: boolean; // default: true
locals?: { [index: string]: any };
- resolve?: { [index: string]: () => angular.IPromise }
+ resolve?: ResolveObject;
attachTo?: string | JQuery | Element;
propagateContainerEvents?: boolean;
panelClass?: string;
@@ -346,10 +347,10 @@ declare module 'angular' {
animation?: IPanelAnimation;
hasBackdrop?: boolean; // default: false
disableParentScroll?: boolean; // default: false
- onDomAdded?: Function;
- onOpenComplete?: Function;
- onRemoving?: Function;
- onDomRemoved?: Function;
+ onDomAdded?(...args: any[]): PromiseLike | void;
+ onOpenComplete?(...args: any[]): PromiseLike | void;
+ onRemoving?(...args: any[]): PromiseLike | void;
+ onDomRemoved?(...args: any[]): PromiseLike | void;
origin?: string | JQuery | Element;
onCloseSuccess?: ((panel: IPanelRef, closeReason: string) => any);
}
@@ -442,11 +443,11 @@ declare module 'angular' {
progressSize?: number;
strokeWidth?: number;
duration?: number;
- easeFn?: Function;
+ easeFn?(t: number, b: number, c: number, d: number): number;
durationIndeterminate?: number;
startIndeterminate?: number;
endIndeterminate?: number;
- easeFnIndeterminate?: Function;
+ easeFnIndeterminate?(t: number, b: number, c: number, d: number): number;
}
interface IProgressCircularProvider {
diff --git a/types/angular-material/tslint.json b/types/angular-material/tslint.json
new file mode 100644
index 0000000000..ffe2c812bd
--- /dev/null
+++ b/types/angular-material/tslint.json
@@ -0,0 +1,7 @@
+{
+ "extends": "../tslint.json",
+ "rules": {
+ "interface-name": false,
+ "max-line-length": false
+ }
+}
\ No newline at end of file