@coolon/angular-ui-powerups 0.0.88 → 0.0.90

package/bundles/coolon-angular-ui-powerups.umd.js

@@ -1095,6 +1095,33 @@
             enumerable: true,
             configurable: true
         });
+        /**
+         * @param {?} confirm
+         * @return {?}
+         */
+        InteractionContext.prototype.confirm = /**
+         * @param {?} confirm
+         * @return {?}
+         */
+        function (confirm) {
+            return __awaiter(this, void 0, void 0, function () {
+                var _a;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            _b.trys.push([0, 2, , 3]);
+                            return [4 /*yield*/, this.confirmOrReject(confirm)];
+                        case 1:
+                            _b.sent();
+                            return [2 /*return*/, true];
+                        case 2:
+                            _a = _b.sent();
+                            return [2 /*return*/, false];
+                        case 3: return [2 /*return*/];
+                    }
+                });
+            });
+        };
         return InteractionContext;
     }(pectin.GarbageCollector));
     if (false) {
@@ -1123,7 +1150,7 @@
          * @param {?} confirm
          * @return {?}
          */
-        InteractionContext.prototype.confirm = function (confirm) { };
+        InteractionContext.prototype.confirmOrReject = function (confirm) { };
         /**
          * Presents the confirmation to the user and runs the activity only if the user confirms.
          * @abstract
@@ -1911,7 +1938,7 @@
          * @param {?} confirm
          * @return {?}
          */
-        ActivityContainerComponent.prototype.confirm = /**
+        ActivityContainerComponent.prototype.confirmOrReject = /**
          * @param {?} confirm
          * @return {?}
          */
@@ -2167,7 +2194,7 @@
          * @param {?} confirm
          * @return {?}
          */
-        InplaceInteractionContextComponent.prototype.confirm = /**
+        InplaceInteractionContextComponent.prototype.confirmOrReject = /**
          * @param {?} confirm
          * @return {?}
          */
@@ -2543,7 +2570,7 @@
          * @param {?} confirm
          * @return {?}
          */
-        DialogInteractionService.prototype.confirm = /**
+        DialogInteractionService.prototype.confirmOrReject = /**
          * @param {?} confirm
          * @return {?}
          */
@@ -2661,78 +2688,6 @@
         return InteractionModule;
     }());
 
-    /**
-     * @fileoverview added by tsickle
-     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var BusyOverlayComponent = /** @class */ (function () {
-        function BusyOverlayComponent() {
-        }
-        /**
-         * @return {?}
-         */
-        BusyOverlayComponent.prototype.ngOnInit = /**
-         * @return {?}
-         */
-        function () {
-        };
-        BusyOverlayComponent.decorators = [
-            { type: core.Component, args: [{
-                        selector: 'aup-busy-overlay',
-                        template: "<ng-content></ng-content>\n<div class=\"busy-overlay-backdrop\" *ngIf=\"busyModel.value\">\n  <mat-progress-spinner mode=\"indeterminate\" [diameter]=\"52\"></mat-progress-spinner>\n</div>\n",
-                        styles: [":host{position:relative}div.busy-overlay-backdrop{position:absolute;background-color:rgba(0,0,0,.2);top:0;left:0;bottom:0;right:0;display:-ms-grid;display:grid;-ms-grid-columns:auto;grid-template-columns:auto;-ms-grid-rows:auto;grid-template-rows:auto;place-content:center}"]
-                    }] }
-        ];
-        /** @nocollapse */
-        BusyOverlayComponent.ctorParameters = function () { return []; };
-        BusyOverlayComponent.propDecorators = {
-            busyModel: [{ type: core.Input }],
-            busy: [{ type: core.Input }]
-        };
-        __decorate([
-            pectin.UseDelegate(),
-            __metadata("design:type", pectin.ValueModel)
-        ], BusyOverlayComponent.prototype, "busyModel", void 0);
-        __decorate([
-            pectin.StoreInValueModel('busyModel'),
-            __metadata("design:type", Boolean)
-        ], BusyOverlayComponent.prototype, "busy", void 0);
-        return BusyOverlayComponent;
-    }());
-    if (false) {
-        /** @type {?} */
-        BusyOverlayComponent.prototype.busyModel;
-        /** @type {?} */
-        BusyOverlayComponent.prototype.busy;
-    }
-
-    /**
-     * @fileoverview added by tsickle
-     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var EmptyStateComponent = /** @class */ (function () {
-        function EmptyStateComponent() {
-        }
-        /**
-         * @return {?}
-         */
-        EmptyStateComponent.prototype.ngOnInit = /**
-         * @return {?}
-         */
-        function () {
-        };
-        EmptyStateComponent.decorators = [
-            { type: core.Component, args: [{
-                        selector: 'aup-empty-state',
-                        template: "\n      <div class=\"container\">\n          <ng-content></ng-content>\n      </div>\n  ",
-                        styles: [":host{display:flex;flex-direction:column;justify-content:center;align-items:center}.container{padding:var(--aup-default-padding);border:2px dashed rgba(0,0,0,.2);border-radius:5px;font-size:14px;font-weight:300}"]
-                    }] }
-        ];
-        /** @nocollapse */
-        EmptyStateComponent.ctorParameters = function () { return []; };
-        return EmptyStateComponent;
-    }());
-
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -3168,49 +3123,25 @@
             return routeIdParameterDef ? visit.getParameter(routeIdParameterDef.name) : null;
         };
         /**
-         * Returns angular router commands that specify the route id and any route parameters.  The result does
-         * not include any path information.
-         */
-        // getFormattedRouterCommands(visit: Visit): any[] {
-        //   return this.hasRouteId() ?
-        //     [this.getFormattedRouteId(visit), this.getFormattedRouteParameters(visit)] :
-        //     [this.getFormattedRouteParameters(visit)];
-        // }
-        /**
-         * Returns angular router commands that specify the route id and any route parameters.  The result does
-         * not include any path information.
          * @param {?} visit
          * @return {?}
          */
-        // getFormattedRouterCommands(visit: Visit): any[] {
-        //   return this.hasRouteId() ?
-        //     [this.getFormattedRouteId(visit), this.getFormattedRouteParameters(visit)] :
-        //     [this.getFormattedRouteParameters(visit)];
-        // }
         PlaceDefinition.prototype.getFormattedRouteId = /**
-         * Returns angular router commands that specify the route id and any route parameters.  The result does
-         * not include any path information.
          * @param {?} visit
          * @return {?}
          */
-        // getFormattedRouterCommands(visit: Visit): any[] {
-        //   return this.hasRouteId() ?
-        //     [this.getFormattedRouteId(visit), this.getFormattedRouteParameters(visit)] :
-        //     [this.getFormattedRouteParameters(visit)];
-        // }
         function (visit) {
-            return visit.hasRouteId() ? this.getRouteIdParameterDef().urlFormat.format(visit.getRouteId()) : null;
+            // Note: RouteIds are always present in the url and are just empty strings when not defined.  This is
+            // mandated by the fact that redirects from <path> to <path>/:id always include the id parameter as
+            // an empty string.
+            return visit.hasRouteId() ? this.getRouteIdParameterDef().urlFormat.format(visit.getRouteId()) : "";
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} visit
          * @param {?=} includeRouteId
          * @return {?}
          */
-        PlaceDefinition.prototype.getFormattedRouteParameters = 
-        // @Trace()
-        /**
+        PlaceDefinition.prototype.getFormattedRouteParameters = /**
          * @param {?} visit
          * @param {?=} includeRouteId
          * @return {?}
@@ -3306,15 +3237,17 @@
                     }
                     else {
                         /** @type {?} */
-                        var value = def.urlFormat.parse(params.get(def.name));
-                        // because our id routes redirect if the id isn't pressent we always have a id
-                        // parameter in our params.  This will bugger our remember and defaultvalue sanitisation
-                        // as it'll see that the id is present (event thought its null).  The sanitisation can't
-                        // check for null as that's a valid value for the id.
-                        /** @type {?} */
-                        var isEmptyRouteId = def.isRouteId && def.isEmptyValue(value);
-                        if (!isEmptyRouteId) {
-                            result[def.name] = value;
+                        var value = params.get(def.name);
+                        if (def.isRouteId) { // TODO: Move this to parameter def so it's a strategy pattern
+                            // because our id routes redirect if the id isn't present we always have a id
+                            // parameter in our params.  This will bugger our remember and defaultvalue sanitisation
+                            // as it'll see that the id is present (event thought its a blank string).
+                            if (!___default__default.isEmpty(value)) {
+                                result[def.name] = def.urlFormat.parse(value);
+                            }
+                        }
+                        else {
+                            result[def.name] = def.urlFormat.parse(value);
                         }
                     }
                 }
@@ -3684,8 +3617,10 @@
                 else {
                     // copy non route params as is, but only if they already exist otherwise we'll inject nil values and break the
                     // defaults and remember sanitisation process.
+                    /** @type {?} */
+                    var value = _this.getParameter(def.name);
                     if (_this.hasParameter(def.name)) {
-                        params[def.name] = _this.getParameter(def.name);
+                        params[def.name] = value;
                     }
                 }
             }));
@@ -3719,17 +3654,6 @@
             var sameNonRouteParameters = ___default.isEqual(this.placeDefinition.getNonRouteParameters(this), this.placeDefinition.getNonRouteParameters(other));
             return !sameNonRouteParameters || this.hasRoutingChangedFrom(other);
         };
-        /**
-         * @return {?}
-         */
-        Visit.prototype.getUrlSegments = /**
-         * @return {?}
-         */
-        function () {
-            return this.placeDefinition.hasRouteId() ?
-                [new router.UrlSegment(this.placeDefinition.path, {}), new router.UrlSegment(this.placeDefinition.getFormattedRouteId(this), this.placeDefinition.getFormattedRouteParameters(this))] :
-                [new router.UrlSegment(this.placeDefinition.path, this.placeDefinition.getFormattedRouteParameters(this))];
-        };
         return Visit;
     }());
     if (false) {
@@ -4029,11 +3953,12 @@
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
-    var PlaceRouter = /** @class */ (function (_super) {
+    exports.ɵt = /** @class */ (function (_super) {
         __extends(PlaceRouter, _super);
-        function PlaceRouter(router$1, angularLocation, placeHistory) {
+        function PlaceRouter(router$1, urlSerializer, angularLocation, placeHistory) {
             var _this = _super.call(this) || this;
             _this.router = router$1;
+            _this.urlSerializer = urlSerializer;
             _this.angularLocation = angularLocation;
             _this.placeHistory = placeHistory;
             _this.firstRoute = true;
@@ -4184,19 +4109,19 @@
                              * @return {?}
                              */
                             function (router) {
-                                // we have to to use the definition for route id as our redirection always includes
-                                // the id in the url segements (but leaves it blank when there's no id). I.e. in the
-                                // no id case we're doing the following redirect [<placePath>, ""] -> ["..", <id>]
                                 /** @type {?} */
-                                var relativePath = !!previous.placeDefinition.hasRouteId() ? '..' : '.';
-                                /** @type {?} */
-                                var commands = __spread([
-                                    relativePath
-                                ], _this.createRouteParameters(next), _this.extractChildPath(activatedRoute.snapshot));
-                                console.log('### Push Changes to route Redirect', { commands: commands, relativeTo: activatedRoute.snapshot.url });
-                                return router.navigate(commands, {
-                                    relativeTo: activatedRoute
-                                });
+                                var commands = _this.createUrlManipulator(_this.router.routerState.snapshot).createRedirectCommandsFor(next);
+                                // // we have to to use the definition for route id as our redirection always includes
+                                // // the id in the url segements (but leaves it blank when there's no id). I.e. in the
+                                // // no id case we're doing the following redirect [<placePath>, ""] -> ["..", <id>]
+                                // const relativePath = !!previous.placeDefinition.hasRouteId() ? '..' : '.';
+                                // const commands = [
+                                //   relativePath,
+                                //   ...this.createRouteParameters(next),
+                                //   ...this.extractChildPath(activatedRoute.snapshot)
+                                // ];
+                                console.log('### Push Changes to route Redirect', { commands: commands });
+                                return router.navigate(commands);
                             }))];
                     }
                     return [2 /*return*/];
@@ -4324,6 +4249,17 @@
              */
             function (child) { return child.url; })));
         };
+        /**
+         * @param {?} snapshot
+         * @return {?}
+         */
+        PlaceRouter.prototype.createUrlManipulator = /**
+         * @param {?} snapshot
+         * @return {?}
+         */
+        function (snapshot) {
+            return new PlaceRouter.UrlManipulator(this.urlSerializer.parse(snapshot.url));
+        };
         PlaceRouter.decorators = [
             { type: core.Injectable, args: [{
                         providedIn: 'root'
@@ -4332,10 +4268,11 @@
         /** @nocollapse */
         PlaceRouter.ctorParameters = function () { return [
             { type: router.Router },
+            { type: router.UrlSerializer },
             { type: common.Location },
             { type: PlaceHistory }
         ]; };
-        /** @nocollapse */ PlaceRouter.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(core.ɵɵinject(router.Router), core.ɵɵinject(common.Location), core.ɵɵinject(PlaceHistory)); }, token: PlaceRouter, providedIn: "root" });
+        /** @nocollapse */ PlaceRouter.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(core.ɵɵinject(router.Router), core.ɵɵinject(router.UrlSerializer), core.ɵɵinject(common.Location), core.ɵɵinject(PlaceHistory)); }, token: PlaceRouter, providedIn: "root" });
         __decorate([
             pectin.Trace(),
             __metadata("design:type", Function),
@@ -4349,31 +4286,145 @@
          * @type {?}
          * @private
          */
-        PlaceRouter.prototype.firstRoute;
+        exports.ɵt.prototype.firstRoute;
         /**
          * @type {?}
          * @private
          */
-        PlaceRouter.prototype._navigationSessionModel;
+        exports.ɵt.prototype._navigationSessionModel;
         /**
          * @type {?}
          * @private
          */
-        PlaceRouter.prototype._activeVisits;
+        exports.ɵt.prototype._activeVisits;
         /** @type {?} */
-        PlaceRouter.prototype.navigationSessionActive;
+        exports.ɵt.prototype.navigationSessionActive;
         /** @type {?} */
-        PlaceRouter.prototype.activeVisitIndex;
+        exports.ɵt.prototype.activeVisitIndex;
         /**
          * @type {?}
          * @private
          */
-        PlaceRouter.prototype.router;
+        exports.ɵt.prototype.router;
+        /**
+         * @type {?}
+         * @private
+         */
+        exports.ɵt.prototype.urlSerializer;
         /** @type {?} */
-        PlaceRouter.prototype.angularLocation;
+        exports.ɵt.prototype.angularLocation;
         /** @type {?} */
-        PlaceRouter.prototype.placeHistory;
+        exports.ɵt.prototype.placeHistory;
     }
+    (function (PlaceRouter) {
+        var UrlManipulator = /** @class */ (function () {
+            function UrlManipulator(urlTree) {
+                this.urlTree = urlTree;
+                console.log({ segments: this.urlTree.root.children.primary.segments });
+            }
+            /**
+             * @return {?}
+             */
+            UrlManipulator.prototype.cloneUrlSegmentList = /**
+             * @return {?}
+             */
+            function () {
+                return __spread(this.urlTree.root.children.primary.segments);
+            };
+            /**
+             * @param {?} visit
+             * @return {?}
+             */
+            UrlManipulator.prototype.updateVisitSegments = /**
+             * @param {?} visit
+             * @return {?}
+             */
+            function (visit) {
+                // Ugly, but it works for now.
+                /** @type {?} */
+                var segments = this.cloneUrlSegmentList();
+                /** @type {?} */
+                var visitSegments = this.convertToUrlSegments(visit);
+                /** @type {?} */
+                var replaceAt = segments.findIndex((/**
+                 * @param {?} segment
+                 * @return {?}
+                 */
+                function (segment) { return segment.path === visitSegments[0].path; }));
+                // do not use the return value, it's the items that were removed!
+                segments.splice.apply(segments, __spread([replaceAt, visitSegments.length], visitSegments));
+                return segments;
+            };
+            /**
+             * Converts the visit into segments.  Please not that these segments are not e
+             * @param visit
+             */
+            /**
+             * Converts the visit into segments.  Please not that these segments are not e
+             * @param {?} visit
+             * @return {?}
+             */
+            UrlManipulator.prototype.convertToUrlSegments = /**
+             * Converts the visit into segments.  Please not that these segments are not e
+             * @param {?} visit
+             * @return {?}
+             */
+            function (visit) {
+                return visit.placeDefinition.hasRouteId() ?
+                    [
+                        // NOTE:
+                        // It's important to attach the params to the root path and not the id.  If we attach them
+                        // to an empty id then the angular router won't match the pattern.
+                        new router.UrlSegment(visit.placeDefinition.path, visit.placeDefinition.getFormattedRouteParameters(visit)),
+                        new router.UrlSegment(visit.placeDefinition.getFormattedRouteId(visit), {})
+                    ]
+                    :
+                        [
+                            new router.UrlSegment(visit.placeDefinition.path, visit.placeDefinition.getFormattedRouteParameters(visit))
+                        ];
+            };
+            /**
+             * @param {?} visit
+             * @return {?}
+             */
+            UrlManipulator.prototype.createRedirectCommandsFor = /**
+             * @param {?} visit
+             * @return {?}
+             */
+            function (visit) {
+                /** @type {?} */
+                var segments = this.updateVisitSegments(visit);
+                /** @type {?} */
+                var commands = [];
+                segments.forEach((/**
+                 * @param {?} s
+                 * @return {?}
+                 */
+                function (s) {
+                    commands.push(s.path);
+                    if (s.parameterMap.keys.length > 0) {
+                        commands.push(s.parameters);
+                    }
+                }));
+                return commands;
+            };
+            __decorate([
+                pectin.Trace(),
+                __metadata("design:type", Function),
+                __metadata("design:paramtypes", [Visit]),
+                __metadata("design:returntype", Array)
+            ], UrlManipulator.prototype, "createRedirectCommandsFor", null);
+            return UrlManipulator;
+        }());
+        PlaceRouter.UrlManipulator = UrlManipulator;
+        if (false) {
+            /**
+             * @type {?}
+             * @private
+             */
+            UrlManipulator.prototype.urlTree;
+        }
+    })(exports.ɵt || (exports.ɵt = {}));
 
     /**
      * @fileoverview added by tsickle
@@ -4760,7 +4811,7 @@
         /** @nocollapse */
         PlaceOutletComponent.ctorParameters = function () { return [
             { type: router.Router },
-            { type: PlaceRouter },
+            { type: exports.ɵt },
             { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [AUP_PLACE_CONFIG,] }] },
             { type: PlaceOutletComponent, decorators: [{ type: core.SkipSelf }, { type: core.Optional }] }
         ]; };
@@ -4936,6 +4987,13 @@
          */
         function () {
         };
+        AbstractPlaceNavigationComponent.decorators = [
+            { type: core.Component, args: [{
+                        template: ''
+                    }] }
+        ];
+        /** @nocollapse */
+        AbstractPlaceNavigationComponent.ctorParameters = function () { return []; };
         AbstractPlaceNavigationComponent.propDecorators = {
             places: [{ type: core.Input }],
             placesModel: [{ type: core.Input }],
@@ -4983,6 +5041,78 @@
         AbstractPlaceNavigationComponent.prototype.activePlaceDefinition;
     }
 
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var BusyOverlayComponent = /** @class */ (function () {
+        function BusyOverlayComponent() {
+        }
+        /**
+         * @return {?}
+         */
+        BusyOverlayComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () {
+        };
+        BusyOverlayComponent.decorators = [
+            { type: core.Component, args: [{
+                        selector: 'aup-busy-overlay',
+                        template: "<ng-content></ng-content>\n<div class=\"busy-overlay-backdrop\" *ngIf=\"busyModel.value\">\n  <mat-progress-spinner mode=\"indeterminate\" [diameter]=\"52\"></mat-progress-spinner>\n</div>\n",
+                        styles: [":host{position:relative}div.busy-overlay-backdrop{position:absolute;background-color:rgba(0,0,0,.2);top:0;left:0;bottom:0;right:0;display:-ms-grid;display:grid;-ms-grid-columns:auto;grid-template-columns:auto;-ms-grid-rows:auto;grid-template-rows:auto;place-content:center}"]
+                    }] }
+        ];
+        /** @nocollapse */
+        BusyOverlayComponent.ctorParameters = function () { return []; };
+        BusyOverlayComponent.propDecorators = {
+            busyModel: [{ type: core.Input }],
+            busy: [{ type: core.Input }]
+        };
+        __decorate([
+            pectin.UseDelegate(),
+            __metadata("design:type", pectin.ValueModel)
+        ], BusyOverlayComponent.prototype, "busyModel", void 0);
+        __decorate([
+            pectin.StoreInValueModel('busyModel'),
+            __metadata("design:type", Boolean)
+        ], BusyOverlayComponent.prototype, "busy", void 0);
+        return BusyOverlayComponent;
+    }());
+    if (false) {
+        /** @type {?} */
+        BusyOverlayComponent.prototype.busyModel;
+        /** @type {?} */
+        BusyOverlayComponent.prototype.busy;
+    }
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var EmptyStateComponent = /** @class */ (function () {
+        function EmptyStateComponent() {
+        }
+        /**
+         * @return {?}
+         */
+        EmptyStateComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+        function () {
+        };
+        EmptyStateComponent.decorators = [
+            { type: core.Component, args: [{
+                        selector: 'aup-empty-state',
+                        template: "\n      <div class=\"container\">\n          <ng-content></ng-content>\n      </div>\n  ",
+                        styles: [":host{display:flex;flex-direction:column;justify-content:center;align-items:center}.container{padding:var(--aup-default-padding);border:2px dashed rgba(0,0,0,.2);border-radius:5px;font-size:14px;font-weight:300}"]
+                    }] }
+        ];
+        /** @nocollapse */
+        EmptyStateComponent.ctorParameters = function () { return []; };
+        return EmptyStateComponent;
+    }());
+
     /**
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -5086,7 +5216,8 @@
                             BusyOverlayComponent,
                             PlaceOutletComponent,
                             TabbedPlaceNavigationComponent,
-                            ListPlaceNavComponent
+                            ListPlaceNavComponent,
+                            AbstractPlaceNavigationComponent
                         ],
                         entryComponents: [BusyOverlayComponent],
                         exports: [
@@ -5094,7 +5225,8 @@
                             PlaceOutletComponent,
                             EmptyStateComponent,
                             TabbedPlaceNavigationComponent,
-                            ListPlaceNavComponent
+                            ListPlaceNavComponent,
+                            AbstractPlaceNavigationComponent
                         ],
                         providers: [
                         // {provide: AUP_PLACE_CONFIG, useValue: {animationDuration: "2000ms"}}
@@ -6043,7 +6175,7 @@
          */
         function (activatedRoute, state) {
             return __awaiter(this, void 0, void 0, function () {
-                var placeDefinition, params, parsedParams, initialVisit, sanitiser, sanitisedVisit, routerStateUrlTree, commands;
+                var placeDefinition, params, parsedParams, initialVisit, sanitiser, sanitisedVisit, commands;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0:
@@ -6060,9 +6192,8 @@
                             // Save the visit with any updated parameters.  We need to save it so we remember any non route parameters
                             this.placeRouter.navigationSession.storeVisit(sanitisedVisit);
                             if (initialVisit.hasRoutingChangedFrom(sanitisedVisit)) {
-                                routerStateUrlTree = this.urlSerializer.parse(state.url);
                                 // Regenerate the url
-                                commands = this.createRedirectCommands(sanitisedVisit, __spread(routerStateUrlTree.root.children.primary.segments)).commands;
+                                commands = this.placeRouter.createUrlManipulator(state).createRedirectCommandsFor(sanitisedVisit);
                                 console.log('##### Place Guard Redirect', commands);
                                 return [2 /*return*/, this.router.createUrlTree(commands, {
                                         replaceUrl: true,
@@ -6079,46 +6210,6 @@
                 });
             });
         };
-        /**
-         * @private
-         * @param {?} sanitisedVisit
-         * @param {?} path
-         * @return {?}
-         */
-        EnterPlaceGuard.prototype.createRedirectCommands = /**
-         * @private
-         * @param {?} sanitisedVisit
-         * @param {?} path
-         * @return {?}
-         */
-        function (sanitisedVisit, path) {
-            // Ugly, but it works for now.
-            /** @type {?} */
-            var newSegments = sanitisedVisit.getUrlSegments();
-            /** @type {?} */
-            var replaceAt = path.findIndex((/**
-             * @param {?} segment
-             * @return {?}
-             */
-            function (segment) { return segment.path === newSegments[0].path; }));
-            /** @type {?} */
-            var newPath = __spread(path);
-            newPath.splice.apply(newPath, __spread([replaceAt, newSegments.length], newSegments)); // do not use the return value, it's the items that were removed!
-            // do not use the return value, it's the items that were removed!
-            /** @type {?} */
-            var commands = [];
-            newPath.forEach((/**
-             * @param {?} s
-             * @return {?}
-             */
-            function (s) {
-                commands.push(s.path);
-                if (s.parameterMap.keys.length > 0) {
-                    commands.push(s.parameters);
-                }
-            }));
-            return { newPath: newPath, commands: commands };
-        };
         EnterPlaceGuard.decorators = [
             { type: core.Injectable, args: [{
                         providedIn: 'root'
@@ -6128,11 +6219,11 @@
         EnterPlaceGuard.ctorParameters = function () { return [
             { type: router.Router },
             { type: router.UrlSerializer },
-            { type: PlaceRouter },
+            { type: exports.ɵt },
             { type: PlaceHistory },
             { type: core.Injector }
         ]; };
-        /** @nocollapse */ EnterPlaceGuard.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function EnterPlaceGuard_Factory() { return new EnterPlaceGuard(core.ɵɵinject(router.Router), core.ɵɵinject(router.UrlSerializer), core.ɵɵinject(PlaceRouter), core.ɵɵinject(PlaceHistory), core.ɵɵinject(core.INJECTOR)); }, token: EnterPlaceGuard, providedIn: "root" });
+        /** @nocollapse */ EnterPlaceGuard.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function EnterPlaceGuard_Factory() { return new EnterPlaceGuard(core.ɵɵinject(router.Router), core.ɵɵinject(router.UrlSerializer), core.ɵɵinject(exports.ɵt), core.ɵɵinject(PlaceHistory), core.ɵɵinject(core.INJECTOR)); }, token: EnterPlaceGuard, providedIn: "root" });
         return EnterPlaceGuard;
     }());
     if (false) {
@@ -6502,11 +6593,11 @@
         LeavePlaceGuard.ctorParameters = function () { return [
             { type: router.Router },
             { type: core.Injector },
-            { type: PlaceRouter },
+            { type: exports.ɵt },
             { type: InteractionContext },
             { type: common.Location }
         ]; };
-        /** @nocollapse */ LeavePlaceGuard.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function LeavePlaceGuard_Factory() { return new LeavePlaceGuard(core.ɵɵinject(router.Router), core.ɵɵinject(core.INJECTOR), core.ɵɵinject(PlaceRouter), core.ɵɵinject(InteractionContext), core.ɵɵinject(common.Location)); }, token: LeavePlaceGuard, providedIn: "root" });
+        /** @nocollapse */ LeavePlaceGuard.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function LeavePlaceGuard_Factory() { return new LeavePlaceGuard(core.ɵɵinject(router.Router), core.ɵɵinject(core.INJECTOR), core.ɵɵinject(exports.ɵt), core.ɵɵinject(InteractionContext), core.ɵɵinject(common.Location)); }, token: LeavePlaceGuard, providedIn: "root" });
         return LeavePlaceGuard;
     }());
     if (false) {
@@ -6569,7 +6660,7 @@
     exports.PlaceHistory = PlaceHistory;
     exports.PlaceModule = PlaceModule;
     exports.PlaceOutletComponent = PlaceOutletComponent;
-    exports.PlaceRouter = PlaceRouter;
+    exports.PlaceRouter = exports.ɵt;
     exports.Point = Point;
     exports.ROUTE_PARAMETER_LIST_KEY = ROUTE_PARAMETER_LIST_KEY;
     exports.ResizeAwareComponent = ResizeAwareComponent;
@@ -6611,7 +6702,6 @@
     exports.ɵp = leftRightPlaceAnimation;
     exports.ɵq = LEFT_RIGHT_PLACE_ANIMATION;
     exports.ɵr = AUP_PLACE_CONFIG;
-    exports.ɵt = PlaceRouter;
     exports.ɵu = PlaceHistory;
     exports.ɵv = TabbedPlaceNavigationComponent;
     exports.ɵw = AbstractPlaceNavigationComponent;