mirror of
https://github.com/zhigang1992/DefinitelyTyped.git
synced 2026-06-07 06:28:26 +08:00
angular-material (#15553)
- updated header - added `ResolveObject` - linting
This commit is contained in:
@@ -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 <code>neonRed</code>
|
||||
$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: '<md-bottom-sheet>Hello!</md-bottom-sheet>',
|
||||
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: '<md-dialog>Hello!</md-dialog>'
|
||||
@@ -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: '<h1>Hello!</h1>',
|
||||
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 });
|
||||
};
|
||||
});
|
||||
|
||||
69
types/angular-material/index.d.ts
vendored
69
types/angular-material/index.d.ts
vendored
@@ -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 <https://github.com/blbigelow>, Peter Hajdu <https://github.com/PeterHajdu>, Davide Donadello <https://github.com/Dona278>, Geert Jansen <https://github.com/geertjansen>
|
||||
// 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<any>>;
|
||||
}
|
||||
|
||||
interface IBottomSheetOptions {
|
||||
templateUrl?: string;
|
||||
template?: string;
|
||||
scope?: angular.IScope; // default: new child scope
|
||||
preserveScope?: boolean; // default: false
|
||||
controller?: string | Function;
|
||||
controller?: string | Injectable<IControllerConstructor>;
|
||||
locals?: { [index: string]: any };
|
||||
clickOutsideToClose?: boolean;
|
||||
bindToController?: boolean; // default: false
|
||||
disableBackdrop?: boolean;
|
||||
escapeToClose?: boolean;
|
||||
resolve?: { [index: string]: () => angular.IPromise<any> };
|
||||
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<IControllerConstructor>): T;
|
||||
locals(locals?: { [index: string]: any }): T;
|
||||
bindToController(bindToController?: boolean): T; // default: false
|
||||
resolve(resolve?: { [index: string]: () => angular.IPromise<any> }): 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<IAlertDialog> {
|
||||
}
|
||||
|
||||
@@ -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<IControllerConstructor>;
|
||||
locals?: { [index: string]: any };
|
||||
bindToController?: boolean; // default: false
|
||||
resolve?: { [index: string]: () => angular.IPromise<any> }
|
||||
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<any>): 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<Element>; // id is a unique ID or URL
|
||||
}
|
||||
type IIcon = (id: string) => angular.IPromise<Element>; // 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<void>;
|
||||
@@ -142,7 +142,7 @@ declare module 'angular' {
|
||||
close(): angular.IPromise<void>;
|
||||
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<ISimpleToastPreset> {
|
||||
}
|
||||
|
||||
@@ -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<IControllerConstructor>;
|
||||
locals?: { [index: string]: any };
|
||||
bindToController?: boolean; // default: false
|
||||
resolve?: { [index: string]: () => angular.IPromise<any> }
|
||||
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<string>;
|
||||
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<IControllerConstructor>;
|
||||
controllerAs?: string;
|
||||
bindToController?: boolean; // default: true
|
||||
locals?: { [index: string]: any };
|
||||
resolve?: { [index: string]: () => angular.IPromise<any> }
|
||||
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> | void;
|
||||
onOpenComplete?(...args: any[]): PromiseLike<void> | void;
|
||||
onRemoving?(...args: any[]): PromiseLike<void> | void;
|
||||
onDomRemoved?(...args: any[]): PromiseLike<void> | 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 {
|
||||
|
||||
7
types/angular-material/tslint.json
Normal file
7
types/angular-material/tslint.json
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"extends": "../tslint.json",
|
||||
"rules": {
|
||||
"interface-name": false,
|
||||
"max-line-length": false
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user