@microsoft/fast-router 1.0.0-alpha.3 → 1.0.0-alpha.30

package/dist/esm/process.js

@@ -1,6 +1,12 @@
 import { __awaiter } from "tslib";
 import { isNavigationPhaseContributor } from "./contributors.js";
 class NavigationPhaseImpl {
+    get route() {
+        return this.routes[this.routes.length - 1];
+    }
+    get router() {
+        return this.routers[this.routers.length - 1];
+    }
     constructor(name, route, router, commitActions, cancelActions) {
         this.name = name;
         this.commitActions = commitActions;
@@ -12,12 +18,6 @@ class NavigationPhaseImpl {
         this.routes.push(route);
         this.routers.push(router);
     }
-    get route() {
-        return this.routes[this.routes.length - 1];
-    }
-    get router() {
-        return this.routers[this.routers.length - 1];
-    }
     cancel(callback) {
         this.canceled = true;
         if (callback) {

package/dist/esm/query-string.js

@@ -1,5 +1,5 @@
 const encode = encodeURIComponent;
-const encodeKey = (key) => encode(key).replace("%24", "$");
+const encodeKey = (key) => encode(key).replace(/%24/g, "$");
 function buildParam(key, value, traditional) {
     let result = [];
     if (value === null || value === undefined) {
@@ -51,14 +51,15 @@ function parseComplexParam(queryParams, keys, value) {
         if (j < keysLastIndex) {
             // The value has to be an array or a false value
             // It can happen that the value is no array if the key was repeated with traditional style like `list=1&list[]=2`
-            const prevValue = !currentParams[key] || typeof currentParams[key] === "object"
-                ? currentParams[key]
-                : [currentParams[key]];
-            currentParams = currentParams[key] =
-                prevValue || (isNaN(keys[j + 1]) ? {} : []);
+            const prevValue = !currentParams.get(key) || typeof currentParams.get(key) === "object"
+                ? currentParams.get(key)
+                : [currentParams.get(key)];
+            currentParams.set(key, prevValue || (isNaN(keys[j + 1]) ? {} : []));
+            currentParams = currentParams.get(key);
         }
         else {
-            currentParams = currentParams[key] = value;
+            currentParams.set(key, value);
+            currentParams = currentParams.get(key);
         }
     }
 }

package/dist/esm/recognizer.js

@@ -1,6 +1,8 @@
 import { __awaiter } from "tslib";
 import { QueryString } from "./query-string.js";
-const defaultParameterConverter = (value) => value;
+const defaultParameterConverter = (name, value, context) => {
+    return value;
+};
 /**
  * @beta
  */
@@ -35,7 +37,7 @@ export class RecognizedRoute {
         this.typedParams = typedParams;
         this.queryParams = queryParams;
         this.allParams = Object.assign(Object.assign({}, params), queryParams);
-        this.allTypedParams = Object.assign(Object.assign({}, typedParams), queryParams);
+        this.allTypedParams = Object.assign(Object.assign({}, queryParams), typedParams);
     }
     get settings() {
         return this.endpoint.settings;
@@ -247,13 +249,13 @@ function compareChains(a, b) {
     return a.compareTo(b);
 }
 class RecognizeResult {
+    get isEmpty() {
+        return this.candidates.length === 0;
+    }
     constructor(rootState) {
         this.candidates = [];
         this.candidates = [new Candidate([""], [rootState], [], this)];
     }
-    get isEmpty() {
-        return this.candidates.length === 0;
-    }
     getSolution() {
         const candidates = this.candidates.filter(hasEndpoint);
         if (candidates.length === 0) {
@@ -386,12 +388,17 @@ export class DefaultRouteRecognizer {
             const paramTypes = endpoint.paramTypes;
             const params = candidate.getParams();
             const typedParams = {};
+            const converterContext = {
+                endpoint,
+                params,
+                typedParams,
+                queryParams,
+            };
             for (let i = 0, ii = paramNames.length; i < ii; ++i) {
-                const name = paramNames[i];
+                const paramName = paramNames[i];
+                const paramValue = params[paramName];
                 const convert = converters[paramTypes[i]] || defaultParameterConverter;
-                const untypedValue = params[name];
-                const typedValue = yield convert(untypedValue);
-                typedParams[name] = typedValue;
+                typedParams[paramName] = yield convert(paramName, paramValue, converterContext);
             }
             return new RecognizedRoute(endpoint, params, typedParams, queryParams);
         });
@@ -532,13 +539,13 @@ function isNotEmpty(segment) {
     return segment.length > 0;
 }
 class StaticSegment {
+    get kind() {
+        return 3 /* SegmentKind.static */;
+    }
     constructor(value, caseSensitive) {
         this.value = value;
         this.caseSensitive = caseSensitive;
     }
-    get kind() {
-        return 3 /* SegmentKind.static */;
-    }
     appendTo(state) {
         const { value, value: { length }, } = this;
         if (this.caseSensitive) {
@@ -566,13 +573,13 @@ class StaticSegment {
     }
 }
 class DynamicSegment {
+    get kind() {
+        return 2 /* SegmentKind.dynamic */;
+    }
     constructor(name, optional) {
         this.name = name;
         this.optional = optional;
     }
-    get kind() {
-        return 2 /* SegmentKind.dynamic */;
-    }
     appendTo(state) {
         state = state.append(/* segment */ this, /* value   */ "/");
         return state;
@@ -588,12 +595,12 @@ class DynamicSegment {
     }
 }
 class StarSegment {
-    constructor(name) {
-        this.name = name;
-    }
     get kind() {
         return 1 /* SegmentKind.star */;
     }
+    constructor(name) {
+        this.name = name;
+    }
     appendTo(state) {
         state = state.append(/* segment */ this, /* value   */ "");
         return state;

package/dist/esm/router.js

@@ -1,9 +1,8 @@
 import { __awaiter } from "tslib";
 import { FASTElement } from "@microsoft/fast-element";
-import { composedParent } from "@microsoft/fast-element/utilities";
+import { composedParent } from "@microsoft/fast-element/utilities.js";
 import { NavigationMessage } from "./navigation.js";
 import { childRouteParameter } from "./routes.js";
-import { RouterExecutionContext } from "./view.js";
 const routerProperty = "$router";
 function findParentRouterForElement(element) {
     let parent = element;
@@ -32,13 +31,20 @@ export const Router = Object.freeze({
         class RouterBase extends BaseType {
             constructor() {
                 super();
-                Router.getOrCreateFor(this);
-            }
-            get config() {
-                return this[routerProperty].config;
-            }
-            set config(value) {
-                this[routerProperty].config = value;
+                const router = Router.getOrCreateFor(this);
+                const config = this.config || null;
+                delete this.config;
+                Reflect.defineProperty(this, "config", {
+                    get() {
+                        return router.config;
+                    },
+                    set(value) {
+                        router.config = value;
+                    },
+                });
+                if (config !== null) {
+                    router.config = config;
+                }
             }
         }
         const proto = RouterBase.prototype;
@@ -114,7 +120,7 @@ export class DefaultRouter {
             }
             this.parentRouter = findParentRouterForElement(this.host);
         }
-        return this.parentRouter || null;
+        return this.parentRouter;
     }
     get level() {
         if (this.parent === null) {
@@ -137,7 +143,8 @@ export class DefaultRouter {
         return __awaiter(this, void 0, void 0, function* () {
             this.newRoute = route;
             this.newView = yield command.createView();
-            this.newView.bind(route.allTypedParams, RouterExecutionContext.create(this));
+            this.newView.context.router = this;
+            this.newView.bind(route.allTypedParams);
             this.newView.appendTo(this.host);
             yield command.transition.begin(this.host, this.view, this.newView);
             return {

package/dist/esm/routes.js

@@ -17,7 +17,7 @@ function getFallbackCommand(config, definition) {
         return Render.fromDefinition(config, definition);
     }
 }
-const booleanConverter = value => {
+const booleanConverter = (name, value) => {
     if (value === void 0 || value === null) {
         return false;
     }
@@ -31,11 +31,11 @@ const booleanConverter = value => {
     }
 };
 const defaultConverters = {
-    number: value => (value === void 0 ? NaN : parseFloat(value)),
-    float: value => (value === void 0 ? NaN : parseFloat(value)),
-    int: value => (value === void 0 ? NaN : parseInt(value)),
-    integer: value => (value === void 0 ? NaN : parseInt(value)),
-    Date: value => (value === void 0 ? new Date(Date.now()) : new Date(value)),
+    number: (name, value) => (value === void 0 ? NaN : parseFloat(value)),
+    float: (name, value) => (value === void 0 ? NaN : parseFloat(value)),
+    int: (name, value) => (value === void 0 ? NaN : parseInt(value)),
+    integer: (name, value) => (value === void 0 ? NaN : parseInt(value)),
+    Date: (name, value) => value === void 0 ? new Date(Date.now()) : new Date(value),
     boolean: booleanConverter,
     bool: booleanConverter,
 };
@@ -129,9 +129,9 @@ export class RouteCollection {
             normalizedConverter = converter.convert.bind(converter);
         }
         else if (converter.prototype && "convert" in converter.prototype) {
-            normalizedConverter = (value) => {
+            normalizedConverter = (name, value, context) => {
                 const obj = this.owner.construct(converter);
-                return obj.convert(value);
+                return obj.convert(name, value, context);
             };
         }
         else {

package/dist/esm/view.js

@@ -1,18 +1,6 @@
 import { __awaiter } from "tslib";
-import { ElementStyles, ExecutionContext, html, } from "@microsoft/fast-element";
+import { ElementStyles, html, } from "@microsoft/fast-element";
 import { isFASTElementHost } from "./router.js";
-/**
- * @beta
- */
-export const RouterExecutionContext = Object.freeze({
-    create(router) {
-        return Object.create(ExecutionContext.default, {
-            router: {
-                value: router,
-            },
-        });
-    },
-});
 /**
  * @beta
  */
@@ -33,17 +21,11 @@ export const Transition = Object.freeze({
  * @beta
  */
 export class FASTElementLayout {
-    constructor(template = null, styles = null, runBeforeCommit = true) {
+    constructor(template = null, styles = undefined, runBeforeCommit = true) {
+        var _a;
         this.template = template;
         this.runBeforeCommit = runBeforeCommit;
-        this.styles =
-            styles === void 0 || styles === null
-                ? null
-                : Array.isArray(styles)
-                    ? new ElementStyles(styles)
-                    : styles instanceof ElementStyles
-                        ? styles
-                        : new ElementStyles([styles]);
+        this.styles = (_a = ElementStyles.normalize(styles)) !== null && _a !== void 0 ? _a : null;
     }
     beforeCommit(routerElement) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -64,8 +46,8 @@ export class FASTElementLayout {
             if (routerElement.$fastController.template !== this.template) {
                 routerElement.$fastController.template = this.template;
             }
-            if (routerElement.$fastController.styles !== this.styles) {
-                routerElement.$fastController.styles = this.styles;
+            if (routerElement.$fastController.mainStyles !== this.styles) {
+                routerElement.$fastController.mainStyles = this.styles;
             }
         }
     }