From a1f0c03fa5d1d7e9c03ac28ebba8a64f89daf6b6 Mon Sep 17 00:00:00 2001 From: LaserUnicorns Date: Mon, 13 Mar 2017 20:10:26 +0300 Subject: [PATCH] Updated type definitions for 'ui-router-extras' (#15151) * ui-router-extras - added tslint.json * ui-router-extras added type definitions for Future States * ui-router-extras - fixed definition header --- ui-router-extras/index.d.ts | 65 +++++++++++- ui-router-extras/tslint.json | 8 ++ ui-router-extras/ui-router-extras-tests.ts | 117 +++++++++++++-------- 3 files changed, 145 insertions(+), 45 deletions(-) create mode 100644 ui-router-extras/tslint.json diff --git a/ui-router-extras/index.d.ts b/ui-router-extras/index.d.ts index 0758058c50..81ddddfc75 100644 --- a/ui-router-extras/index.d.ts +++ b/ui-router-extras/index.d.ts @@ -1,6 +1,6 @@ -// Type definitions for UI-Router Extras (ct.ui.router.extras module) 0.0 +// Type definitions for ui-router-extras 0.1 // Project: https://github.com/christopherthielen/ui-router-extras -// Definitions by: Michael Putters , Marcel van de Kamp +// Definitions by: Michael Putters , Marcel van de Kamp , Viktor Smirnov // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped /// @@ -117,11 +117,11 @@ declare module 'angular' { /* * Function (injectable). Called when a sticky state is navigated away from (inactivated). */ - onInactivate?: Function; + onInactivate?: (...args: any[]) => void; /* * Function (injectable). Called when an inactive sticky state is navigated to (reactivated). */ - onReactivate?: Function; + onReactivate?: (...args: any[]) => void; /* * Note: named views are mandatory when using sticky states! */ @@ -149,5 +149,62 @@ declare module 'angular' { state(config: IStickyState): IStateProvider; state(name: string, config: IStickyState): IStateProvider; } + + + interface IFutureStateProvider { + + /** + * Registers a `FutureState` object as a placeholder for a full UI-Router `state` or `state` tree. + */ + futureState(state: IFutureState): void; + + /** + * Registers a `StateFactory` function for `FutureState` of type `type`. + */ + stateFactory(type: string, stateFactory: IFutureStateFactory): void; + + /** + * Adds a resolve function. + * `$futureStateProvider` won't reject any state transitions or routes until all resolveFunction promises have been resolved. + * Resolves may be used to defer routing until the states have been loaded via $http, for instance. + */ + addResolve(resolveFn: IResolveFunction): void; + } + + interface IFutureStateService { + + } + + /** + * A `FutureState` object is a placeholder for full a UI-Router `state` + */ + interface IFutureState { + + /** + * The placeholder state name (fully qualified). + * Attempted transitions to this state (or any substates) will trigger a lazy load of the full UI-Router `state` represented by this FutureState. + */ + stateName: string; + + /** + * The placeholder url path fragment (the fragment is the URL prefix which the state will be accessed on, not the URL of the state's source code). + * Attempted navigations to a URL starting with this fragment will trigger a lazy load of the full UI-Router `state` represented by this FutureState. + */ + url: string; + + /** + * The type of FutureState. This is a used to select a registered StateFactory which is then used to build the full UI-Router `state` + */ + type: string; + + [key: string]: any; + } + + /** + * `StateFactory` factories convert `FutureState` into a full UI-Router `state`, or `state` tree + */ + type IFutureStateFactory = angular.Injectable<(...args: any[]) => angular.IPromise>; + + type IResolveFunction = angular.Injectable<(...args: any[]) => angular.IPromise>; } } diff --git a/ui-router-extras/tslint.json b/ui-router-extras/tslint.json new file mode 100644 index 0000000000..19dc9db271 --- /dev/null +++ b/ui-router-extras/tslint.json @@ -0,0 +1,8 @@ +{ + "extends": "../tslint.json", + "rules": { + "interface-name": [ + false + ] + } +} diff --git a/ui-router-extras/ui-router-extras-tests.ts b/ui-router-extras/ui-router-extras-tests.ts index 3de40aef76..427c0ca498 100644 --- a/ui-router-extras/ui-router-extras-tests.ts +++ b/ui-router-extras/ui-router-extras-tests.ts @@ -3,30 +3,30 @@ var myApp = angular.module('testModule') myApp.config(($stateProvider: angular.ui.IStateProvider, $stickyStateProvider: angular.ui.IStickyStateProvider) => { var state: angular.ui.IStickyState = { - name: 'test', + name: 'test', sticky: true, dsr: { default: 'substate', params: ['param1', 'param2'], - fn: function ($dsr$) { + fn: ($dsr$) => { return $dsr$.to; } }, - onInactivate: function ($state: angular.ui.IState) { + onInactivate: ($state: angular.ui.IState) => { var iAmInjectedByInjector = $state; }, - onReactivate: function ($state: angular.ui.IState) { + onReactivate: ($state: angular.ui.IState) => { var iAmInjectedByInjector = $state; }, controller: ($previousState: angular.ui.IPreviousStateService, $deepstateRedirect: angular.ui.IDeepStateRedirectService) => { - $previousState.memo('test-memo1'); - $previousState.memo('test-memo2', 'test-state-name2'); - $previousState.memo('test-memo3', 'test-state-name3', {}); - $previousState.forget('test-memo3'); - $previousState.go('test-memo2', { - location: true, - notify: true + $previousState.memo('test-memo1'); + $previousState.memo('test-memo2', 'test-state-name2'); + $previousState.memo('test-memo3', 'test-state-name3', {}); + $previousState.forget('test-memo3'); + $previousState.go('test-memo2', { + location: true, + notify: true }); $previousState.get(); $previousState.get('test-memo1'); @@ -40,36 +40,36 @@ myApp.config(($stateProvider: angular.ui.IStateProvider, $stickyStateProvider: a //named views are mandatory 'name1': {} } - }; + }; + + $stickyStateProvider.enableDebug(true); + $stateProvider.state(state); - $stickyStateProvider.enableDebug(true); - $stateProvider.state(state); - $stateProvider.state({ - name: 'test', + name: 'test', sticky: true, dsr: { default: 'substate', params: ['param1', 'param2'], - fn: function ($dsr$) { + fn: ($dsr$) => { return $dsr$.to; } }, - onInactivate: function ($state: angular.ui.IState) { + onInactivate: ($state: angular.ui.IState) => { var iAmInjectedByInjector = $state; }, - onReactivate: function ($state: angular.ui.IState) { + onReactivate: ($state: angular.ui.IState) => { var iAmInjectedByInjector = $state; }, controller: ($previousState: angular.ui.IPreviousStateService, $deepstateRedirect: angular.ui.IDeepStateRedirectService) => { - $previousState.memo('test-memo1'); - $previousState.memo('test-memo2', 'test-state-name2'); - $previousState.memo('test-memo3', 'test-state-name3', {}); - $previousState.forget('test-memo3'); - $previousState.go('test-memo2', { - location: true, - notify: true + $previousState.memo('test-memo1'); + $previousState.memo('test-memo2', 'test-state-name2'); + $previousState.memo('test-memo3', 'test-state-name3', {}); + $previousState.forget('test-memo3'); + $previousState.go('test-memo2', { + location: true, + notify: true }); $previousState.get(); $previousState.get('test-memo1'); @@ -83,33 +83,33 @@ myApp.config(($stateProvider: angular.ui.IStateProvider, $stickyStateProvider: a //named views are mandatory 'name1': {} } - }); - + }); + $stateProvider.state('name1', { - name: 'test', + name: 'test', sticky: true, dsr: { default: 'substate', params: ['param1', 'param2'], - fn: function ($dsr$) { + fn: ($dsr$) => { return $dsr$.to; } }, - onInactivate: function ($state: angular.ui.IState) { + onInactivate: ($state: angular.ui.IState) => { var iAmInjectedByInjector = $state; }, - onReactivate: function ($state: angular.ui.IState) { + onReactivate: ($state: angular.ui.IState) => { var iAmInjectedByInjector = $state; }, controller: ($previousState: angular.ui.IPreviousStateService, $deepstateRedirect: angular.ui.IDeepStateRedirectService) => { - $previousState.memo('test-memo1'); - $previousState.memo('test-memo2', 'test-state-name2'); - $previousState.memo('test-memo3', 'test-state-name3', {}); - $previousState.forget('test-memo3'); - $previousState.go('test-memo2', { - location: true, - notify: true + $previousState.memo('test-memo1'); + $previousState.memo('test-memo2', 'test-state-name2'); + $previousState.memo('test-memo3', 'test-state-name3', {}); + $previousState.forget('test-memo3'); + $previousState.go('test-memo2', { + location: true, + notify: true }); $previousState.get(); $previousState.get('test-memo1'); @@ -123,6 +123,41 @@ myApp.config(($stateProvider: angular.ui.IStateProvider, $stickyStateProvider: a //named views are mandatory 'name1': {} } - }); - + }); + }); + +var templateLoadStateFactory: ng.ui.IFutureStateFactory = ($q: ng.IQService, $timeout: ng.ITimeoutService, futureState: ng.ui.IFutureState) => { + var d = $q.defer(); + $timeout(() => { + var fullUiRouterState = { + name: futureState.stateName, + url: futureState.url, + template: '

Template

' + } + d.resolve(fullUiRouterState); // Async resolve of ui-router state promise + }, 1000); + return d.promise; // ui-router state promise returned +} + +myApp.config(($futureStateProvider: ng.ui.IFutureStateProvider) => { + $futureStateProvider.addResolve(($q: ng.IQService, $timeout: ng.ITimeoutService) => { + var d = $q.defer(); + $timeout(() => { + d.resolve("When this resolves, future state provider will re-sync the state/url"); + }, 1000); + return d.promise; + }); + + var futureState = { type: 'ngload', stateName: 'foo', url: '/foo', src: 'foo.js' }; + $futureStateProvider.futureState(futureState); + + $futureStateProvider.stateFactory('ngload', templateLoadStateFactory); +}); + +var adminModuleFutureState: ng.ui.IFutureState = { + stateName: 'app.admin', + url: '/admin', + type: 'ngload', + src: 'js/modules/admin.js' // example custom attr +}