UNPKG

26.6 kBSource Map (JSON)View Raw
1{
2 "version": 3,
3 "file": "interface.js",
4 "sourceRoot": "",
5 "sources": [
6 "@uirouter/core/state/interface.ts"
7 ],
8 "names": [],
9 "mappings": "",
10 "sourcesContent": [
11 "import { ParamDeclaration, RawParams } from '../params/interface';\nimport { StateObject } from './stateObject';\nimport { ViewContext } from '../view/interface';\nimport { IInjectable } from '../common/common';\nimport { Transition } from '../transition/transition';\nimport { TransitionStateHookFn, TransitionOptions } from '../transition/interface';\nimport { ResolvePolicy, ResolvableLiteral, ProviderLike } from '../resolve/interface';\nimport { Resolvable } from '../resolve/resolvable';\nimport { TargetState } from './targetState';\n\nexport type StateOrName = string | StateDeclaration | StateObject;\n\nexport interface TransitionPromise extends Promise<StateObject> {\n transition: Transition;\n}\n\nexport interface TargetStateDef {\n state: StateOrName;\n params?: RawParams;\n options?: TransitionOptions;\n}\n\nexport type ResolveTypes = Resolvable | ResolvableLiteral | ProviderLike;\n/**\n * Base interface for declaring a view\n *\n * This interface defines the basic data that a normalized view declaration will have on it.\n * Each implementation of UI-Router (for a specific framework) should define its own extension of this interface.\n * Add any additional fields that the framework requires to that interface.\n */\nexport interface _ViewDeclaration {\n /**\n * The raw name for the view declaration, i.e., the [[StateDeclaration.views]] property name.\n */\n $name?: string;\n\n /**\n * The normalized address for the `ui-view` which this ViewConfig targets.\n *\n * A ViewConfig targets a `ui-view` in the DOM (relative to the `uiViewContextAnchor`) which has\n * a specific name.\n * @example `header` or `$default`\n *\n * The `uiViewName` can also target a _nested view_ by providing a dot-notation address\n * @example `foo.bar` or `foo.$default.bar`\n */\n $uiViewName?: string;\n\n /**\n * The normalized context anchor (state name) for the `uiViewName`\n *\n * When targeting a `ui-view`, the `uiViewName` address is anchored to a context name (state name).\n */\n $uiViewContextAnchor?: string;\n\n /**\n * A type identifier for the View\n *\n * This is used when loading prerequisites for the view, before it enters the DOM. Different types of views\n * may load differently (e.g., templateProvider+controllerProvider vs component class)\n */\n $type?: string;\n\n /**\n * The context that this view is declared within.\n */\n $context?: ViewContext;\n}\n\n/**\n * The return value of a [[redirectTo]] function\n *\n * - string: a state name\n * - TargetState: a target state, parameters, and options\n * - object: an object with a state name and parameters\n */\nexport type RedirectToResult = string | TargetState | { state?: string; params?: RawParams } | void;\n\n/**\n * The StateDeclaration object is used to define a state or nested state.\n *\n * Note: Each implementation of UI-Router (for a specific framework)\n * extends this interface as necessary.\n *\n * #### Example:\n * ```js\n * // StateDeclaration object\n * var foldersState = {\n * name: 'folders',\n * url: '/folders',\n * component: FoldersComponent,\n * resolve: {\n * allfolders: function(FolderService) {\n * return FolderService.list();\n * }\n * },\n * }\n *\n * registry.register(foldersState);\n * ```\n */\nexport interface StateDeclaration {\n /**\n * The state name (required)\n *\n * A unique state name, e.g. `\"home\"`, `\"about\"`, `\"contacts\"`.\n * To create a parent/child state use a dot, e.g. `\"about.sales\"`, `\"home.newest\"`.\n *\n * Note: [State] objects require unique names.\n * The name is used like an id.\n */\n name?: string;\n\n /**\n * Abstract state indicator\n *\n * An abstract state can never be directly activated.\n * Use an abstract state to provide inherited properties (url, resolve, data, etc) to children states.\n */\n abstract?: boolean;\n\n /**\n * The parent state\n *\n * Normally, a state's parent is implied from the state's [[name]], e.g., `\"parentstate.childstate\"`.\n *\n * Alternatively, you can explicitly set the parent state using this property.\n * This allows shorter state names, e.g., `<a ui-sref=\"childstate\">Child</a>`\n * instead of `<a ui-sref=\"parentstate.childstate\">Child</a>\n *\n * When using this property, the state's name should not have any dots in it.\n *\n * #### Example:\n * ```js\n * var parentstate = {\n * name: 'parentstate'\n * }\n * var childstate = {\n * name: 'childstate',\n * parent: 'parentstate'\n * // or use a JS var which is the parent StateDeclaration, i.e.:\n * // parent: parentstate\n * }\n * ```\n */\n parent?: string | StateDeclaration;\n\n /**\n * Gets the internal State object API\n *\n * Gets the *internal API* for a registered state.\n *\n * Note: the internal [[StateObject]] API is subject to change without notice\n * @internal\n */\n $$state?: () => StateObject;\n\n /**\n * Resolve - a mechanism to asynchronously fetch data, participating in the Transition lifecycle\n *\n * The `resolve:` property defines data (or other dependencies) to be fetched asynchronously when the state is being entered.\n * After the data is fetched, it may be used in views, transition hooks or other resolves that belong to this state.\n * The data may also be used in any views or resolves that belong to nested states.\n *\n * ### As an array\n *\n * Each array element should be a [[ResolvableLiteral]] object.\n *\n * #### Example:\n * The `user` resolve injects the current `Transition` and the `UserService` (using its token, which is a string).\n * The [[ResolvableLiteral.resolvePolicy]] sets how the resolve is processed.\n * The `user` data, fetched asynchronously, can then be used in a view.\n * ```js\n * var state = {\n * name: 'user',\n * url: '/user/:userId\n * resolve: [\n * {\n * token: 'user',\n * policy: { when: 'EAGER' },\n * deps: ['UserService', Transition],\n * resolveFn: (userSvc, trans) => userSvc.fetchUser(trans.params().userId) },\n * }\n * ]\n * }\n * ```\n *\n * Note: an Angular 2 style [`useFactory` provider literal](https://angular.io/docs/ts/latest/cookbook/dependency-injection.html#!#provide)\n * may also be used. See [[ProviderLike]].\n * #### Example:\n * ```\n * resolve: [\n * { provide: 'token', useFactory: (http) => http.get('/'), deps: [ Http ] },\n * ]\n * ```\n *\n * ### As an object\n *\n * The `resolve` property may be an object where:\n * - Each key (string) is the name of the dependency.\n * - Each value (function) is an injectable function which returns the dependency, or a promise for the dependency.\n *\n * This style is based on AngularJS injectable functions, but can be used with any UI-Router implementation.\n * If your code will be minified, the function should be [\"annotated\" in the AngularJS manner](https://docs.angularjs.org/guide/di#dependency-annotation).\n *\n * #### AngularJS Example:\n * ```js\n * resolve: {\n * // If you inject `myStateDependency` into a controller, you'll get \"abc\"\n * myStateDependency: function() {\n * return \"abc\";\n * },\n * // Dependencies are annotated in \"Inline Array Annotation\"\n * myAsyncData: ['$http', '$transition$' function($http, $transition$) {\n * // Return a promise (async) for the data\n * return $http.get(\"/foos/\" + $transition$.params().foo);\n * }]\n * }\n * ```\n *\n * Note: You cannot specify a policy for each Resolvable, nor can you use non-string\n * tokens when using the object style `resolve:` block.\n *\n * ### Lifecycle\n *\n * Since a resolve function can return a promise, the router will delay entering the state until the promises are ready.\n * If any of the promises are rejected, the Transition is aborted with an Error.\n *\n * By default, resolves for a state are fetched just before that state is entered.\n * Note that only states which are being *entered* during the `Transition` have their resolves fetched.\n * States that are \"retained\" do not have their resolves re-fetched.\n *\n * If you are currently in a parent state `parent` and are transitioning to a child state `parent.child`, the\n * previously resolved data for state `parent` can be injected into `parent.child` without delay.\n *\n * Any resolved data for `parent.child` is retained until `parent.child` is exited, e.g., by transitioning back to the `parent` state.\n *\n * Because of this scoping and lifecycle, resolves are a great place to fetch your application's primary data.\n *\n * ### Injecting resolves into other things\n *\n * During a transition, Resolve data can be injected into:\n *\n * - Views (the components which fill a `ui-view` tag)\n * - Transition Hooks\n * - Other resolves (a resolve may depend on asynchronous data from a different resolve)\n *\n * ### Injecting other things into resolves\n *\n * Resolve functions usually have dependencies on some other API(s).\n * The dependencies are usually declared and injected into the resolve function.\n * A common pattern is to inject a custom service such as `UserService`.\n * The resolve then delegates to a service method, such as `UserService.list()`;\n *\n * #### Special injectable tokens\n *\n * - `UIRouter`: The [[UIRouter]] instance which has references to all the UI-Router services.\n * - `Transition`: The current [[Transition]] object; information and API about the current transition, such as\n * \"to\" and \"from\" State Parameters and transition options.\n * - `'$transition$'`: A string alias for the `Transition` injectable\n * - `'$state$'`: For `onEnter`/`onExit`/`onRetain`, the state being entered/exited/retained.\n * - Other resolve tokens: A resolve can depend on another resolve, either from the same state, or from any parent state.\n *\n * #### Example:\n * ```js\n * // Injecting a resolve into another resolve\n * resolve: [\n * // Define a resolve 'allusers' which delegates to the UserService.list()\n * // which returns a promise (async) for all the users\n * { provide: 'allusers', useFactory: (UserService) => UserService.list(), deps: [UserService] },\n *\n * // Define a resolve 'user' which depends on the allusers resolve.\n * // This resolve function is not called until 'allusers' is ready.\n * { provide: 'user', (allusers, trans) => _.find(allusers, trans.params().userId, deps: ['allusers', Transition] }\n * }\n * ```\n */\n resolve?: ResolveTypes[] | { [key: string]: IInjectable };\n\n /**\n * Sets the resolve policy defaults for all resolves on this state\n *\n * This should be an [[ResolvePolicy]] object.\n *\n * It can contain the following optional keys/values:\n *\n * - `when`: (optional) defines when the resolve is fetched. Accepted values: \"LAZY\" or \"EAGER\"\n * - `async`: (optional) if the transition waits for the resolve. Accepted values: \"WAIT\", \"NOWAIT\", {@link CustomAsyncPolicy}\n *\n * See [[ResolvePolicy]] for more details.\n */\n resolvePolicy?: ResolvePolicy;\n\n /**\n * The url fragment for the state\n *\n * A URL fragment (with optional parameters) which is used to match the browser location with this state.\n *\n * This fragment will be appended to the parent state's URL in order to build up the overall URL for this state.\n * See [[UrlMatcher]] for details on acceptable patterns.\n *\n * @examples\n * ```js\n *\n * url: \"/home\"\n * // Define a parameter named 'userid'\n * url: \"/users/:userid\"\n * // param 'bookid' has a custom regexp\n * url: \"/books/{bookid:[a-zA-Z_-]}\"\n * // param 'categoryid' is of type 'int'\n * url: \"/books/{categoryid:int}\"\n * // two parameters for this state\n * url: \"/books/{publishername:string}/{categoryid:int}\"\n * // Query parameters\n * url: \"/messages?before&after\"\n * // Query parameters of type 'date'\n * url: \"/messages?{before:date}&{after:date}\"\n * // Path and query parameters\n * url: \"/messages/:mailboxid?{before:date}&{after:date}\"\n * ```\n */\n url?: string;\n\n /**\n * Params configuration\n *\n * An object which optionally configures parameters declared in the url, or defines additional non-url\n * parameters. For each parameter being configured, add a [[ParamDeclaration]] keyed to the name of the parameter.\n *\n * #### Example:\n * ```js\n * params: {\n * param1: {\n * type: \"int\",\n * array: true,\n * value: []\n * },\n * param2: {\n * value: \"index\"\n * }\n * }\n * ```\n */\n params?: { [key: string]: ParamDeclaration | any };\n\n /**\n * Named views\n *\n * An optional object which defines multiple views, or explicitly targets specific named ui-views.\n *\n * - What is a view config\n * - What is a ui-view\n * - Shorthand controller/template\n * - Incompatible with ^\n *\n * Examples:\n *\n * Targets three named ui-views in the parent state's template\n *\n * #### Example:\n * ```js\n * views: {\n * header: {\n * controller: \"headerCtrl\",\n * templateUrl: \"header.html\"\n * }, body: {\n * controller: \"bodyCtrl\",\n * templateUrl: \"body.html\"\n * }, footer: {\n * controller: \"footCtrl\",\n * templateUrl: \"footer.html\"\n * }\n * }\n * ```\n *\n * @example\n * ```js\n * // Targets named ui-view=\"header\" from ancestor state 'top''s template, and\n * // named `ui-view=\"body\" from parent state's template.\n * views: {\n * 'header@top': {\n * controller: \"msgHeaderCtrl\",\n * templateUrl: \"msgHeader.html\"\n * }, 'body': {\n * controller: \"messagesCtrl\",\n * templateUrl: \"messages.html\"\n * }\n * }\n * ```\n */\n views?: { [key: string]: _ViewDeclaration };\n\n /**\n * An inherited property to store state data\n *\n * This is a spot for you to store inherited state metadata.\n * Child states' `data` object will prototypally inherit from their parent state.\n *\n * This is a good spot to put metadata such as `requiresAuth`.\n *\n * Note: because prototypal inheritance is used, changes to parent `data` objects reflect in the child `data` objects.\n * Care should be taken if you are using `hasOwnProperty` on the `data` object.\n * Properties from parent objects will return false for `hasOwnProperty`.\n */\n data?: any;\n\n /**\n * Synchronously or asynchronously redirects Transitions to a different state/params\n *\n * If this property is defined, a Transition directly to this state will be redirected based on the property's value.\n *\n * - If the value is a `string`, the Transition is redirected to the state named by the string.\n *\n * - If the property is an object with a `state` and/or `params` property,\n * the Transition is redirected to the named `state` and/or `params`.\n *\n * - If the value is a [[TargetState]] the Transition is redirected to the `TargetState`\n *\n * - If the property is a function:\n * - The function is called with the current [[Transition]]\n * - The return value is processed using the previously mentioned rules.\n * - If the return value is a promise, the promise is waited for, then the resolved async value is processed using the same rules.\n *\n * Note: `redirectTo` is processed as an `onStart` hook, before `LAZY` resolves.\n * If your redirect function relies on resolve data, get the [[Transition.injector]] and get a\n * promise for the resolve data using [[UIInjector.getAsync]].\n *\n * #### Example:\n * ```js\n * // a string\n * .state('A', {\n * redirectTo: 'A.B'\n * })\n *\n * // a {state, params} object\n * .state('C', {\n * redirectTo: { state: 'C.D', params: { foo: 'index' } }\n * })\n *\n * // a fn\n * .state('E', {\n * redirectTo: () => \"A\"\n * })\n *\n * // a fn conditionally returning a {state, params}\n * .state('F', {\n * redirectTo: (trans) => {\n * if (trans.params().foo < 10)\n * return { state: 'F', params: { foo: 10 } };\n * }\n * })\n *\n * // a fn returning a promise for a redirect\n * .state('G', {\n * redirectTo: (trans) => {\n * let svc = trans.injector().get('SomeAsyncService')\n * let promise = svc.getAsyncRedirectTo(trans.params.foo);\n * return promise;\n * }\n * })\n *\n * // a fn that fetches resolve data\n * .state('G', {\n * redirectTo: (trans) => {\n * // getAsync tells the resolve to load\n * let resolvePromise = trans.injector().getAsync('SomeResolve')\n * return resolvePromise.then(resolveData => resolveData === 'login' ? 'login' : null);\n * }\n * })\n * ```\n */\n redirectTo?:\n | RedirectToResult\n | ((transition: Transition) => RedirectToResult)\n | ((transition: Transition) => Promise<RedirectToResult>);\n\n /**\n * A Transition Hook called with the state is being entered. See: [[IHookRegistry.onEnter]]\n *\n * #### Example:\n * ```js\n * .state({\n * name: 'mystate',\n * onEnter: function(trans, state) {\n * console.log(\"Entering \" + state.name);\n * }\n * });\n * ```\n *\n * Note: The above `onEnter` on the state declaration is effectively sugar for:\n *\n * ```js\n * transitionService.onEnter({ entering: 'mystate' }, function(trans, state) {\n * console.log(\"Entering \" + state.name);\n * });\n * ```\n */\n onEnter?: TransitionStateHookFn;\n /**\n * A [[TransitionStateHookFn]] called with the state is being retained/kept. See: [[IHookRegistry.onRetain]]\n *\n * #### Example:\n * ```js\n * .state({\n * name: 'mystate',\n * onRetain: function(trans, state) {\n * console.log(state.name + \" is still active!\");\n * }\n * });\n * ```\n *\n * Note: The above `onRetain` on the state declaration is effectively sugar for:\n *\n * ```js\n * transitionService.onRetain({ retained: 'mystate' }, function(trans, state) {\n * console.log(state.name + \" is still active!\");\n * });\n * ```\n */\n onRetain?: TransitionStateHookFn;\n /**\n * A Transition Hook called with the state is being exited. See: [[IHookRegistry.onExit]]\n *\n * #### Example:\n * ```js\n * .state({\n * name: 'mystate',\n * onExit: function(trans, state) {\n * console.log(\"Leaving \" + state.name);\n * }\n * });\n * ```\n *\n * Note: The above `onRetain` on the state declaration is effectively sugar for:\n *\n * ```js\n * transitionService.onExit({ exiting: 'mystate' }, function(trans, state) {\n * console.log(\"Leaving \" + state.name);\n * });\n * ```\n */\n onExit?: TransitionStateHookFn;\n\n /**\n * A function used to lazy load code\n *\n * The `lazyLoad` function is invoked before the state is activated.\n * The transition waits while the code is loading.\n *\n * The function should load the code that is required to activate the state.\n * For example, it may load a component class, or some service code.\n * The function must return a promise which resolves when loading is complete.\n *\n * For example, this code lazy loads a service before the `abc` state is activated:\n *\n * ```\n * .state('abc', {\n * lazyLoad: (transition, state) => import('./abcService')\n * }\n * ```\n *\n * The `abcService` file is imported and loaded\n * (it is assumed that the `abcService` file knows how to register itself as a service).\n *\n * #### Lifecycle\n *\n * - The `lazyLoad` function is invoked if a transition is going to enter the state.\n * - The function is invoked before the transition starts (using an `onBefore` transition hook).\n * - The function is only invoked once; while the `lazyLoad` function is loading code, it will not be invoked again.\n * For example, if the user double clicks a ui-sref, `lazyLoad` is only invoked once even though there were two transition attempts.\n * Instead, the existing lazy load promise is re-used.\n * - When the promise resolves successfully, the `lazyLoad` property is deleted from the state declaration.\n * - If the promise resolves to a [[LazyLoadResult]] which has an array of `states`, those states are registered.\n * - The original transition is retried (this time without the `lazyLoad` property present).\n *\n * - If the `lazyLoad` function fails, then the transition also fails.\n * The failed transition (and the `lazyLoad` function) could potentially be retried by the user.\n *\n * ### Lazy loading state definitions (Future States)\n *\n * State definitions can also be lazy loaded.\n * This might be desirable when building large, multi-module applications.\n *\n * To lazy load state definitions, a Future State should be registered as a placeholder.\n * When the state definitions are lazy loaded, the Future State is deregistered.\n *\n * A future state can act as a placeholder for a single state, or for an entire module of states and substates.\n * A future state should have:\n *\n * - A `name` which ends in `.**`.\n * A future state's `name` property acts as a wildcard [[Glob]].\n * It matches any state name that starts with the `name` (including child states that are not yet loaded).\n * - A `url` prefix.\n * A future state's `url` property acts as a wildcard.\n * UI-Router matches all paths that begin with the `url`.\n * It effectively appends `.*` to the internal regular expression.\n * When the prefix matches, the future state will begin loading.\n * - A `lazyLoad` function.\n * This function should should return a Promise to lazy load the code for one or more [[StateDeclaration]] objects.\n * It should return a [[LazyLoadResult]].\n * Generally, one of the lazy loaded states should have the same name as the future state.\n * The new state will then **replace the future state placeholder** in the registry.\n *\n * ### Additional resources\n *\n * For in depth information on lazy loading and Future States, see the [Lazy Loading Guide](https://ui-router.github.io/guides/lazyload).\n *\n * #### Example: states.js\n * ```js\n *\n * // This child state is a lazy loaded future state\n * // The `lazyLoad` function loads the final state definition\n * {\n * name: 'parent.**',\n * url: '/parent',\n * lazyLoad: () => import('./lazy.states.js')\n * }\n * ```\n *\n * #### Example: lazy.states.js\n *\n * This file is lazy loaded. It exports an array of states.\n *\n * ```js\n * import {ChildComponent} from \"./child.component.js\";\n * import {ParentComponent} from \"./parent.component.js\";\n *\n * // This fully defined state replaces the future state\n * let parentState = {\n * // the name should match the future state\n * name: 'parent',\n * url: '/parent/:parentId',\n * component: ParentComponent,\n * resolve: {\n * parentData: ($transition$, ParentService) =>\n * ParentService.get($transition$.params().parentId)\n * }\n * }\n *\n * let childState = {\n * name: 'parent.child',\n * url: '/child/:childId',\n * params: {\n * childId: \"default\"\n * },\n * resolve: {\n * childData: ($transition$, ChildService) =>\n * ChildService.get($transition$.params().childId)\n * }\n * };\n *\n * // This array of states will be registered by the lazyLoad hook\n * let lazyLoadResults = {\n * states: [ parentState, childState ]\n * };\n *\n * export default lazyLoadResults;\n * ```\n *\n * @param transition the [[Transition]] that is activating the future state\n * @param state the [[StateDeclaration]] that the `lazyLoad` function is declared on\n * @return a Promise to load the states.\n * Optionally, if the promise resolves to a [[LazyLoadResult]],\n * the states will be registered with the [[StateRegistry]].\n */\n lazyLoad?: (transition: Transition, state: StateDeclaration) => Promise<LazyLoadResult>;\n\n /**\n * Marks all the state's parameters as `dynamic`.\n *\n * All parameters on the state will use this value for `dynamic` as a default.\n * Individual parameters may override this default using [[ParamDeclaration.dynamic]] in the [[params]] block.\n *\n * Note: this value overrides the `dynamic` value on a custom parameter type ([[ParamTypeDefinition.dynamic]]).\n */\n dynamic?: boolean;\n\n /**\n * Marks all query parameters as [[ParamDeclaration.dynamic]]\n *\n * @deprecated use either [[dynamic]] or [[ParamDeclaration.dynamic]]\n */\n reloadOnSearch?: boolean;\n}\n\n/**\n * The return type of a [[StateDeclaration.lazyLoad]] function\n *\n * If your state has a `lazyLoad` function, it should return a promise.\n * If promise resolves to an object matching this interface, then the `states` array\n * of [[StateDeclaration]] objects will be automatically registered.\n */\nexport interface LazyLoadResult {\n states?: StateDeclaration[];\n}\n\n/**\n * An options object for [[StateService.href]]\n */\nexport interface HrefOptions {\n /**\n * Defines what state to be \"relative from\"\n *\n * When a relative path is found (e.g `^` or `.bar`), defines which state to be relative from.\n */\n relative?: StateOrName;\n\n /**\n * If true, and if there is no url associated with the state provided in the\n * first parameter, then the constructed href url will be built from the first\n * ancestor which has a url.\n */\n lossy?: boolean;\n\n /**\n * If `true` will inherit parameters from the current parameter values.\n */\n inherit?: boolean;\n\n /**\n * If true will generate an absolute url, e.g. `http://www.example.com/fullurl`.\n */\n absolute?: boolean;\n}\n\n/**\n * Either a [[StateDeclaration]] or an ES6 class that implements [[StateDeclaration]]\n * The ES6 class constructor should have no arguments.\n */\nexport type _StateDeclaration = StateDeclaration | { new (): StateDeclaration };\n"
12 ]
13}
\No newline at end of file