@angular-wave/angular.ts 0.7.8 → 0.8.1

package/src/router/state/state.test.js

@@ -5,6 +5,7 @@ const TEST_URL = "src/router/state/state.html?random=false";
 test("unit tests contain no errors", async ({ page }) => {
   await page.goto(TEST_URL);
   await page.content();
+  await page.waitForTimeout(1000);
   await expect(page.locator(".jasmine-overall-result")).toHaveText(
     /0 failures/,
   );

package/src/router/state/views.js

@@ -64,7 +64,7 @@ export function ng1ViewsBuilder(state) {
     name = name || "$default";
     // Account for views: { header: "headerComponent" }
     if (isString(config)) config = { component: config };
-    // Make a shallow copy of the config object
+    // Make a shallow copy of the urlConfig object
     config = Object.assign({}, config);
     // Do not allow a view to mix props for component-style view with props for template/controller-style view
     if (hasAnyKey(compKeys, config) && hasAnyKey(nonCompKeys, config)) {

package/src/router/state-filter.spec.js

@@ -1,4 +1,4 @@
-import { Angular } from "../loader.js";
+import { Angular } from "../angular.js";
 import { dealoc } from "../shared/dom.js";
 
 describe("router filters", function () {

package/src/router/state-filters.js

@@ -1,3 +1,7 @@
+import { $injectTokens as $t } from "../injection-tokens.js";
+
+$IsStateFilter.$inject = [$t.$state];
+
 /**
  * `isState` Filter: truthy if the current state is the parameter
  *
@@ -7,18 +11,19 @@
  * ```html
  * <div ng-if="'stateName' | isState">show if state is 'stateName'</div>
  * ```
- */
-$IsStateFilter.$inject = ["$state"];
-/**
+ *
+ * @param {import('./state/state-service.js').StateProvider} $state
  * @returns {import('../interface.ts').FilterFn}
  */
 export function $IsStateFilter($state) {
-  const isFilter = function (state, params, options) {
-    return $state.is(state, params, options);
-  };
+  const isFilter = (state, params, options) =>
+    $state.is(state, params, options);
   isFilter.$stateful = true;
   return isFilter;
 }
+
+$IncludedByStateFilter.$inject = [$t.$state];
+
 /**
  * `includedByState` Filter: truthy if the current state includes the parameter
  *
@@ -28,9 +33,8 @@ export function $IsStateFilter($state) {
  * ```html
  * <div ng-if="'fullOrPartialStateName' | includedByState">show if state includes 'fullOrPartialStateName'</div>
  * ```
- */
-$IncludedByStateFilter.$inject = ["$state"];
-/**
+ *
+ * @param {import('./state/state-service.js').StateProvider} $state
  * @returns {import('../interface.ts').FilterFn}
  */
 export function $IncludedByStateFilter($state) {

package/src/router/template-factory.js

@@ -4,6 +4,7 @@ import { Resolvable } from "./resolve/resolvable.js";
 import { kebobString } from "../shared/strings.js";
 import { annotate } from "../core/di/injector.js";
 import { DirectiveSuffix } from "../core/compile/compile.js";
+import { $injectTokens as $t } from "../injection-tokens.js";
 
 /**
  * @typedef BindingTuple
@@ -21,10 +22,10 @@ export class TemplateFactoryProvider {
   }
 
   $get = [
-    "$http",
-    "$templateCache",
-    "$templateRequest",
-    "$injector",
+    $t.$http,
+    $t.$templateCache,
+    $t.$templateRequest,
+    $t.$injector,
     /**
      * @param {import("interface.ts").HttpService} $http
      * @param {import("../services/template-cache/interface.ts").TemplateCache} $templateCache

package/src/router/template-factory.spec.js

@@ -1,5 +1,5 @@
 import { dealoc } from "../shared/dom.js";
-import { Angular } from "../loader.js";
+import { Angular } from "../angular.js";
 import { wait } from "../shared/test-utils.js";
 
 describe("templateFactory", () => {
@@ -78,9 +78,9 @@ describe("templateFactory", () => {
       ]);
       $injector.invoke(
         (_$templateFactory_, _$httpBackend_, _$sce_, $rootScope) => {
-          ($templateFactory = _$templateFactory_),
-            ($httpBackend = _$httpBackend_),
-            ($sce = _$sce_);
+          $templateFactory = _$templateFactory_;
+          $httpBackend = _$httpBackend_;
+          $sce = _$sce_;
           $scope = $rootScope;
         },
       );
@@ -119,9 +119,9 @@ describe("templateFactory", () => {
           _$state_,
           _$compile_,
         ) => {
-          ($templateFactory = _$templateFactory_),
-            ($httpBackend = _$httpBackend_),
-            ($sce = _$sce_);
+          $templateFactory = _$templateFactory_;
+          $httpBackend = _$httpBackend_;
+          $sce = _$sce_;
           $scope = $rootScope;
           $stateRegistry = _$stateRegistry_;
           $stateService = _$state_;

package/src/router/transition/hook-registry.js

@@ -1,6 +1,6 @@
 import { removeFrom, tail, map } from "../../shared/common.js";
 import { isString, isFunction } from "../../shared/utils.js";
-import { Glob } from "../common/glob.js";
+import { Glob } from "../glob/glob.js";
 import { TransitionHookScope } from "./interface.js";
 /**
  * Determines if the given state matches the matchCriteria

package/src/router/transition/transition-service.js

@@ -31,6 +31,7 @@ import { registerIgnoredTransitionHook } from "../hooks/ignored-transition.js";
 import { registerInvalidTransitionHook } from "../hooks/invalid-transition.js";
 import { registerRedirectToHook } from "../hooks/redirect-to.js";
 import { registerUpdateUrl } from "../hooks/url.js";
+import { $injectTokens as $t, provider } from "../../injection-tokens.js";
 /**
  * The default [[Transition]] options.
  *
@@ -61,10 +62,10 @@ export let defaultTransOpts = {
  * This API is located at `router.transitionService` ([[UIRouter.transitionService]])
  */
 export class TransitionProvider {
-  static $inject = ["$routerGlobalsProvider", "$viewProvider"];
+  /* @ignore */ static $inject = provider([$t.$router, $t.$view]);
 
   /**
-   * @param {import('../globals.js').RouterGlobals} globals
+   * @param {import('../router.js').Router} globals
    * @param viewService
    */
   constructor(globals, viewService) {
@@ -92,10 +93,10 @@ export class TransitionProvider {
   }
 
   $get = [
-    "$state",
-    "$urlService",
-    "$stateRegistry",
-    "$view",
+    $t.$state,
+    $t.$url,
+    $t.$stateRegistry,
+    $t.$view,
     (stateService, urlService, stateRegistry, viewService) => {
       // Lazy load state trees
       this._deregisterHookFns.lazyLoad = registerLazyLoadHook(

package/src/router/transition/transition.js

@@ -40,15 +40,15 @@ export class Transition {
    *
    * If the target state is not valid, an error is thrown.
    *
-   * @param fromPath The path of [[PathNode]]s from which the transition is leaving.  The last node in the `fromPath`
+   * @param {Array<import('../path/path-node.js').PathNode>} fromPath The path of [[PathNode]]s from which the transition is leaving.  The last node in the `fromPath`
    *        encapsulates the "from state".
-   * @param targetState The target state and parameters being transitioned to (also, the transition options)
+   * @param {import('../state/target-state.js').TargetState} targetState The target state and parameters being transitioned to (also, the transition options)
    * @param {import('../transition/transition-service.js').TransitionProvider} transitionService The [[TransitionService]] instance
-   * @param {import('../globals.js').RouterGlobals} globals
+   * @param {import('../router.js').Router} globals
    */
   constructor(fromPath, targetState, transitionService, globals) {
     /**
-     * @type {import('../globals.js').RouterGlobals}
+     * @type {import('../router.js').Router}
      */
     this.globals = globals;
     this.transitionService = transitionService;
@@ -586,8 +586,8 @@ export class Transition {
         ).length
       );
     };
-    const newTC = this.treeChanges();
-    const pendTC = pending && pending.treeChanges();
+    const newTC = this._treeChanges;
+    const pendTC = pending && pending._treeChanges;
     if (
       pendTC &&
       same(pendTC.to, newTC.to) &&

package/src/router/url/url-matcher.js

@@ -93,13 +93,6 @@ const defaultConfig = {
  *
  */
 export class UrlMatcher {
-  static encodeDashes(str) {
-    // Replace dashes with encoded "\-"
-    return encodeURIComponent(str).replace(
-      /-/g,
-      (c) => `%5C%${c.charCodeAt(0).toString(16).toUpperCase()}`,
-    );
-  }
   /** @internal Given a matcher, return an array with the matcher's path segments and path params, in order */
   static pathSegmentsAndParams(matcher) {
     const staticSegments = matcher._segments;
@@ -310,9 +303,6 @@ export class UrlMatcher {
     return this.pattern;
   }
   _getDecodedParamValue(value, param) {
-    if (isDefined(value)) {
-      value = param.type.decode(value);
-    }
     return param.value(value);
   }
   /**
@@ -334,9 +324,9 @@ export class UrlMatcher {
    * // returns { id: 'bob', q: 'hello', r: null }
    * ```
    *
-   * @param path    The URL path to match, e.g. `$location.path()`.
-   * @param search  URL search parameters, e.g. `$location.search()`.
-   * @param hash    URL hash e.g. `$location.hash()`.
+   * @param path    The URL path to match, e.g. `$location.getPath()`.
+   * @param search  URL search parameters, e.g. `$location.getSearch()`.
+   * @param hash    URL hash e.g. `$location.getHash()`.
    *
    * @returns The captured parameter values.
    */
@@ -503,7 +493,7 @@ export class UrlMatcher {
       if (encoded == null) return acc;
       // If this parameter value is an array, encode the value using encodeDashes
       if (Array.isArray(encoded))
-        return acc + map(encoded, UrlMatcher.encodeDashes).join("-");
+        return acc + map(encoded, encodeDashes).join("-");
       // If the parameter type is "raw", then do not encodeURIComponent
       if (param.raw) return acc + encoded;
       // Encode the value
@@ -532,3 +522,11 @@ export class UrlMatcher {
 }
 
 UrlMatcher.nameValidator = /^\w+([-.]+\w+)*(?:\[\])?$/;
+
+function encodeDashes(str) {
+  // Replace dashes with encoded "\-"
+  return encodeURIComponent(str).replace(
+    /-/g,
+    (c) => `%5C%${c.charCodeAt(0).toString(16).toUpperCase()}`,
+  );
+}

package/src/router/url/url-rule.js

@@ -6,7 +6,7 @@ import {
   isUndefined,
   assert,
 } from "../../shared/utils.js";
-import { is, or, pattern } from "../../shared/hof.js";
+import { is, pattern } from "../../shared/hof.js";
 import { StateObject } from "../state/state-object.js";
 /**
  * Creates a [[UrlRule]]
@@ -19,6 +19,11 @@ import { StateObject } from "../state/state-object.js";
  * - [[StateObject]]
  */
 export class UrlRuleFactory {
+  /**
+   * @param {import('../url/url-service.js').UrlService} urlService
+   * @param {import('../state/state-service.js').StateProvider} stateService
+   * @param {import('../router.js').Router} routerGlobals
+   */
   constructor(urlService, stateService, routerGlobals) {
     this.urlService = urlService;
     this.stateService = stateService;
@@ -37,7 +42,7 @@ export class UrlRuleFactory {
       [isString, (_what) => makeRule(this.urlService.compile(_what))],
       [is(UrlMatcher), (_what) => this.fromUrlMatcher(_what, handler)],
       [
-        or(isState, isStateDeclaration),
+        (...args) => isState(...args) || isStateDeclaration(...args),
         (_what) => this.fromState(_what, this.stateService, this.routerGlobals),
       ],
       [is(RegExp), (_what) => this.fromRegExp(_what, handler)],
@@ -211,6 +216,7 @@ export class BaseUrlRule {
     this.$id = -1;
     this._group = undefined;
     this.handler = handler || ((x) => x);
+    this.priority = undefined;
   }
 
   /**

package/src/router/url/url-rules.js

@@ -5,7 +5,9 @@ import { isDefined, isFunction, isString } from "../../shared/utils.js";
 import { removeFrom } from "../../shared/common.js";
 import { UrlRuleFactory } from "./url-rule.js";
 
-const prioritySort = (a, b) => (b.priority || 0) - (a.priority || 0);
+function prioritySort(a, b) {
+  return (b.priority || 0) - (a.priority || 0);
+}
 
 const typeSort = (a, b) => {
   const weights = { STATE: 4, URLMATCHER: 4, REGEXP: 3, RAW: 2, OTHER: 1 };
@@ -36,8 +38,7 @@ const idSort = (a, b) => {
  *   - Equally sorted State and UrlMatcher rules will each match the URL.
  *     Then, the *best* match is chosen based on how many parameter values were matched.
  */
-let defaultRuleSortFn;
-defaultRuleSortFn = (a, b) => {
+function defaultRuleSortFn(a, b) {
   let cmp = prioritySort(a, b);
   if (cmp !== 0) return cmp;
   cmp = typeSort(a, b);
@@ -45,7 +46,8 @@ defaultRuleSortFn = (a, b) => {
   cmp = urlMatcherSort(a, b);
   if (cmp !== 0) return cmp;
   return idSort(a, b);
-};
+}
+
 function getHandlerFn(handler) {
   if (
     !isFunction(handler) &&
@@ -67,9 +69,10 @@ function getHandlerFn(handler) {
  *
  * The most commonly used methods are [[otherwise]] and [[when]].
  *
- * This API is found at `$urlService.rules` (see: [[UIRouter.urlService]], [[URLService.rules]])
+ * This API is found at `$url.rules` (see: [[UIRouter.urlService]], [[URLService.rules]])
  */
 export class UrlRules {
+  /** @param {UrlRuleFactory} urlRuleFactory */
   constructor(urlRuleFactory) {
     this._sortFn = defaultRuleSortFn;
     this._rules = [];

package/src/router/url/url-service.js

@@ -13,44 +13,43 @@ import { UrlMatcher } from "./url-matcher.js";
 import { ParamFactory } from "../params/param-factory.js";
 import { UrlRuleFactory } from "./url-rule.js";
 import { getBaseHref } from "../../shared/dom.js";
+import { $injectTokens as $t, provider } from "../../injection-tokens.js";
 
 /**
  * API for URL management
  */
 export class UrlService {
-  static $inject = [
-    "$locationProvider",
-    "$stateProvider",
-    "$routerGlobalsProvider",
-    "$urlConfigProvider",
-  ];
+  static $inject = provider([
+    $t.$location,
+    $t.$state,
+    $t.$router,
+    $t.$urlConfig,
+  ]);
+
+  /** @type {import("../../services/location/location").Location} */
+  $location;
 
   /**
    * @param {import("../../services/location/location").LocationProvider} $locationProvider
    * @param {import("../../router/state/state-service.js").StateProvider} stateService
-   * @param globals
+   * @param {import("../router.js").Router} globals
    * @param {import("../../router/url/url-config.js").UrlConfigProvider} urlConfigProvider
    */
   constructor($locationProvider, stateService, globals, urlConfigProvider) {
+    this.$locationProvider = $locationProvider;
     this.stateService = stateService;
     this.stateService.urlService = this; // circular wiring
-    this.$locationProvider = $locationProvider;
-    this.$location = undefined;
 
     /** Provides services related to the URL */
     this.urlRuleFactory = new UrlRuleFactory(this, this.stateService, globals);
 
     /**
      * The nested [[UrlRules]] API for managing URL rules and rewrites
-     *
-     * See: [[UrlRules]] for details
      * @type {UrlRules}
      */
     this.rules = new UrlRules(this.urlRuleFactory);
     /**
      * The nested [[UrlConfig]] API to configure the URL and retrieve URL information
-     *
-     * See: [[UrlConfig]] for details
      * @type {import("./url-config.js").UrlConfigProvider}
      */
     this.config = urlConfigProvider;
@@ -58,37 +57,44 @@ export class UrlService {
     /** Creates a new [[Param]] for a given location (DefType) */
     this.paramFactory = new ParamFactory(this.config);
 
-    /**
-     * Gets the path part of the current url
-     *
-     * If the current URL is `/some/path?query=value#anchor`, this returns `/some/path`
-     *
-     * @return the path portion of the url
-     */
-    this.path = () => this.$location.path();
-    /**
-     * Gets the search part of the current url as an object
-     *
-     * If the current URL is `/some/path?query=value#anchor`, this returns `{ query: 'value' }`
-     *
-     * @return the search (query) portion of the url, as an object
-     */
-    this.search = () => this.$location.search();
-    /**
-     * Gets the hash part of the current url
-     *
-     * If the current URL is `/some/path?query=value#anchor`, this returns `anchor`
-     *
-     * @return the hash (anchor) portion of the url
-     */
-    this.hash = () => this.$location.hash();
-
     this._urlListeners = [];
   }
 
+  /**
+   * Gets the path part of the current url
+   *
+   * If the current URL is `/some/path?query=value#anchor`, this returns `/some/path`
+   *
+   * @return {string} the path portion of the url
+   */
+  getPath() {
+    return this.$location.getPath();
+  }
+
+  /**
+   * Gets the search part of the current url as an object
+   *
+   * If the current URL is `/some/path?query=value#anchor`, this returns `{ query: 'value' }`
+   *
+   * @return {Object} the search (query) portion of the url, as an object
+   */
+  getSearch() {
+    return this.$location.getSearch();
+  }
+  /**
+   * Gets the hash part of the current url
+   *
+   * If the current URL is `/some/path?query=value#anchor`, this returns `anchor`
+   *
+   * @return {string} the hash (anchor) portion of the url
+   */
+  getHash() {
+    return this.$location.getHash();
+  }
+
   $get = [
-    "$location",
-    "$rootScope",
+    $t.$location,
+    $t.$rootScope,
     /**
      *
      * @param {import('../../services/location/location.js').Location} $location
@@ -102,21 +108,14 @@ export class UrlService {
           fn(evt);
         });
       });
-      this.listen();
+      this.listen(true);
       return this;
     },
   ];
 
   /**
-   * @returns {boolean}
+   * @returns {string}
    */
-  html5Mode() {
-    return (
-      this.$locationProvider.getHtml5Mode().enabled &&
-      typeof history !== "undefined"
-    );
-  }
-
   baseHref() {
     return (
       this._baseHref ||
@@ -171,20 +170,21 @@ export class UrlService {
    * @param {string} [newUrl] The new value for the URL.
    *               This url should reflect only the new internal [[path]], [[search]], and [[hash]] values.
    *               It should not include the protocol, site, port, or base path of an absolute HREF.
-   * @param {boolean} [replace] When true, replaces the current history entry (instead of appending it) with this new url
    * @param {any} [state] The history's state object, i.e., pushState (if the LocationServices implementation supports it)
    *
    * @return the url (after potentially being processed)
    */
-  url(newUrl, replace = false, state) {
-    if (isDefined(newUrl)) this.$location.url(newUrl);
-    if (replace) this.$location.replace();
-    if (state) this.$location.state(state);
-    return this.$location.url();
+  url(newUrl, state) {
+    if (isDefined(newUrl)) {
+      const decodeUri = decodeURIComponent(newUrl);
+      this.$location.setUrl(decodeUri);
+    }
+    if (state) this.$location.setState(state);
+    return this.$location.getUrl();
   }
 
   /**
-   * @internal
+   * @private
    *
    * Registers a low level url change handler
    *
@@ -195,8 +195,8 @@ export class UrlService {
    * let deregisterFn = locationServices.onChange((evt) => console.log("url change", evt));
    * ```
    *
-   * @param callback a function that will be called when the url is changing
-   * @return a function that de-registers the callback
+   * @param {Function} callback a function that will be called when the url is changing
+   * @return {Function} a function that de-registers the callback
    */
   onChange(callback) {
     this._urlListeners.push(callback);
@@ -204,13 +204,21 @@ export class UrlService {
   }
 
   /**
-   * Gets the current URL parts
+   * Gets the current URL parts.
+   *
+   * Returns an object with the `path`, `search`, and `hash` components
+   * of the current browser location.
    *
-   * This method returns the different parts of the current URL (the [[path]], [[search]], and [[hash]]) as a [[UrlParts]] object.
+   * @returns {import("../../services/location/interface.ts").UrlParts} The current URL's path, search, and hash.
    */
   parts() {
-    return { path: this.path(), search: this.search(), hash: this.hash() };
+    return {
+      path: this.$location.getPath(),
+      search: this.$location.getSearch(),
+      hash: this.$location.getHash(),
+    };
   }
+
   /**
    * Activates the best rule for the current URL
    *
@@ -234,16 +242,16 @@ export class UrlService {
     if (evt && evt.defaultPrevented) return;
     const stateService = this.stateService;
     const url = {
-      path: this.path(),
-      search: this.search(),
-      hash: this.hash(),
+      path: this.$location.getPath(),
+      search: this.$location.getSearch(),
+      hash: this.$location.getHash(),
     };
     /**
      * @type {*}
      */
     const best = this.match(url);
     const applyResult = pattern([
-      [isString, (newurl) => this.url(newurl, true)],
+      [isString, (newurl) => this.url(newurl)],
       [
         TargetState.isDef,
         (def) => stateService.go(def.state, def.params, def.options),
@@ -276,7 +284,7 @@ export class UrlService {
    * });
    * ```
    *
-   * @param enabled `true` or `false` to start or stop listening to URL changes
+   * @param {boolean} enabled `true` or `false` to start or stop listening to URL changes
    */
   listen(enabled) {
     if (enabled === false) {
@@ -354,7 +362,7 @@ export class UrlService {
    * ```js
    * matcher = $umf.compile("/about/:person");
    * params = { person: "bob" };
-   * $bob = $urlService.href(matcher, params);
+   * $bob = $url.href(matcher, params);
    * // $bob == "/about/bob";
    * ```
    *
@@ -370,22 +378,18 @@ export class UrlService {
     let url = urlMatcher.format(params);
     if (url == null) return null;
     options = options || { absolute: false };
-    const isHtml5 = this.html5Mode();
-    if (!isHtml5 && url !== null) {
-      url = "#" + this.$locationProvider.getHashPrefix() + url;
+    const isHtml5 = this.$locationProvider.html5ModeConf.enabled;
+    if (!isHtml5) {
+      url = "#" + this.$locationProvider.hashPrefixConf + url;
     }
     url = appendBasePath(url, isHtml5, options.absolute, this.baseHref());
     if (!options.absolute || !url) {
       return url;
     }
     const slash = !isHtml5 && url ? "/" : "";
-    const cfgPort = this.$location.port();
-    const port = cfgPort === 80 || cfgPort === 443 ? "" : ":" + cfgPort;
     return [
-      this.$location.protocol(),
-      "://",
-      this.$location.host(),
-      port,
+      `${window.location.protocol}//`,
+      window.location.host,
       slash,
       url,
     ].join("");