@framing/ng-core/@framing/ng-core.js

/**
 * @license Framing v0.8.4
 * Copyright 2016-2017 Biznas Innovations, Inc. http://biznas.io
 * License: Apache License, Version 2.0
 */
import { ANALYZE_FOR_ENTRY_COMPONENTS, ChangeDetectorRef, Component, ComponentFactoryResolver, Directive, EventEmitter, Injectable, Injector, Input, NgModule, NgModuleFactory, Output, Type, ViewContainerRef } from '@angular/core';
import { ActivatedRoute, NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Router, RouterModule } from '@angular/router';
import { ReplaySubject } from 'rxjs/Rx';
import { assign, camelCase, clone, defaults, differenceWith, each, filter, find, isArray, isEmpty, isEqual, isNil, keys, merge, reject, uniqWith } from 'lodash';
import * as _ from 'lodash';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { ReplaySubject as ReplaySubject$1, Subject } from 'rxjs';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';

var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (undefined && undefined.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
let FramingComponentOutletDirective = class FramingComponentOutletDirective {
    constructor(_view) {
        this._view = _view;
        this.onComponent = new EventEmitter();
    }
    isActivated() { return !!this._componentRef; }
    ngOnChanges(changes) {
        let activate = false;
        if (changes.ngModuleFactory) {
            if (this._moduleRef) {
                this._moduleRef.destroy();
            }
            if (this.ngModuleFactory) {
                const injector = this.injector || this._view.parentInjector;
                this._moduleRef = this.ngModuleFactory.create(injector);
            }
            else {
                this._moduleRef = undefined;
            }
            activate = true;
        }
        if (changes.framingComponentOutlet.currentValue !== changes.framingComponentOutlet.previousValue) {
            activate = true;
        }
        if (activate) {
            this.activate(this.framingComponentOutlet);
        }
    }
    ngOnDestroy() {
        this.deactivate();
        if (this._moduleRef) {
            this._moduleRef.destroy();
        }
    }
    activate(component) {
        this.deactivate();
        if (!component) {
            return;
        }
        try {
            const injector = this.injector || this._view.parentInjector;
            const factory = injector.get(ComponentFactoryResolver).resolveComponentFactory(component);
            this._componentRef = this._view.createComponent(factory, this._view.length, injector, this.content);
            this.onComponent.emit(this._componentRef);
            try {
                this._componentRef.changeDetectorRef.detectChanges();
            }
            catch (e) {
                console.error(`detectChanges failed on activated component in FramingComponentOutlet`, { e, component });
                return;
            }
        }
        catch (e) {
            console.error(`Failed to activate component in FramingComponentOutlet`, { e, component });
            return;
        }
    }
    deactivate() {
        if (this._componentRef) {
            this._view.remove(this._view.indexOf(this._componentRef.hostView));
            this._componentRef.destroy();
        }
        this._view.clear();
        this._componentRef = undefined;
    }
};
__decorate([
    Input(),
    __metadata("design:type", Type)
], FramingComponentOutletDirective.prototype, "framingComponentOutlet", void 0);
__decorate([
    Input(),
    __metadata("design:type", Injector)
], FramingComponentOutletDirective.prototype, "injector", void 0);
__decorate([
    Input(),
    __metadata("design:type", Array)
], FramingComponentOutletDirective.prototype, "content", void 0);
__decorate([
    Input(),
    __metadata("design:type", NgModuleFactory)
], FramingComponentOutletDirective.prototype, "ngModuleFactory", void 0);
__decorate([
    Output(),
    __metadata("design:type", EventEmitter)
], FramingComponentOutletDirective.prototype, "onComponent", void 0);
FramingComponentOutletDirective = __decorate([
    Directive({
        selector: '[framingComponentOutlet]',
    }),
    __metadata("design:paramtypes", [ViewContainerRef])
], FramingComponentOutletDirective);

var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
let FramingComponentOutletModule = FramingComponentOutletModule_1 = class FramingComponentOutletModule {
    static withEntryComponents(...components) {
        return {
            ngModule: FramingComponentOutletModule_1,
            providers: [
                { provide: ANALYZE_FOR_ENTRY_COMPONENTS, useValue: components, multi: true },
            ],
        };
    }
};
FramingComponentOutletModule = FramingComponentOutletModule_1 = __decorate$1([
    NgModule({
        declarations: [FramingComponentOutletDirective],
        exports: [FramingComponentOutletDirective],
    })
], FramingComponentOutletModule);
var FramingComponentOutletModule_1;

var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$2 = (undefined && undefined.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
let FramingContainerOutletService = class FramingContainerOutletService {
    constructor(router) {
        this.router = router;
        this.contentsSubject = new ReplaySubject();
        this.contents = [];
        this.routeContents = [];
        this.subscriptions = [];
        this.subscriptions.push(this.router.events.subscribe((event) => {
            if (event instanceof NavigationEnd) {
                this.onNavigationEnd();
            }
        }));
    }
    get contents$() { return this.contentsSubject.asObservable(); }
    hasContent(container) {
        return !!this.contents.filter((c) => isEqual(c.container, container)).length;
    }
    activate(content) {
        this.contents.push(content);
        this.contentsSubject.next(clone(this.contents));
        return () => { this.deactivate(content); };
    }
    deactivate(content) {
        this.contents = this.contents.filter((e) => e !== content);
        this.contentsSubject.next(clone(this.contents));
    }
    onNavigationEnd() {
        let newRouteContents = [];
        this.resolveRouteContents(this.router.routerState.snapshot.root, newRouteContents);
        newRouteContents = uniqWith(newRouteContents, isEqual);
        const newContents = differenceWith(newRouteContents, this.routeContents, isEqual);
        const removedContents = differenceWith(this.routeContents, newRouteContents, isEqual);
        newContents.forEach((c) => this.activate(c));
        removedContents.forEach((c) => this.deactivate(c));
        this.routeContents = newRouteContents;
    }
    resolveRouteContents(snapshot, routeContents) {
        if (snapshot.data && snapshot.data.containers) {
            const containers = snapshot.data.containers;
            for (const container of containers) {
                routeContents.push(container);
            }
        }
        for (let child of snapshot.children) {
            this.resolveRouteContents(child, routeContents);
        }
    }
};
FramingContainerOutletService = __decorate$3([
    Injectable(),
    __metadata$2("design:paramtypes", [Router])
], FramingContainerOutletService);

var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$1 = (undefined && undefined.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
let FramingContainerOutletDirective = class FramingContainerOutletDirective {
    constructor(_view, _containerService, _router) {
        this._view = _view;
        this._containerService = _containerService;
        this._router = _router;
        this.onComponents = new EventEmitter();
        this._activated = [];
        this._subscriptions = [];
    }
    containerName() { return this.framingContainerOutlet; }
    isActivated() { return this._activated.length > 0; }
    ngOnInit() {
        if (!this.framingContainerOutlet) {
            console.warn('FramingContainerOutlet without a container name');
        }
        else {
            if (this.framingContainerOutlet[0] === '\'') {
                console.warn(`FramingContainerOutlet name "${this.framingContainerOutlet}" starts with a qoute`);
            }
            this._subscriptions.push(this._containerService.contents$.subscribe((contents) => this.onContent(contents)));
        }
        this._subscriptions.push(this._router.events.subscribe((event) => {
            if (event instanceof NavigationEnd) {
                if (!this.optionalContainer && !this.isActivated()) {
                    console.warn(`No content for required FramingContainerOutlet '${this.framingContainerOutlet}' found`);
                }
            }
        }));
    }
    ngOnDestroy() {
        this._activated.forEach((a) => this.deactivate(a));
        this._subscriptions.forEach((s) => s.unsubscribe());
    }
    onContent(allContents) {
        const contents = allContents.filter((c) => isEqual(c.container, this.framingContainerOutlet));
        // remove all content that is no longer active
        this._activated.forEach((a) => {
            if (contents.findIndex((content) => content === a.content) === -1) {
                this.deactivate(a);
            }
        });
        this._activated = this._activated.filter((a) => !!a.ref);
        // now setup the new activated components
        let i = 0;
        for (let content of contents) {
            if (this._activated.length > i) {
                if (this._activated[i].content !== content) {
                    // look for this content
                    const activatedIndex = this._activated.findIndex((a) => a.content === content);
                    if (activatedIndex === -1) {
                        // activate this content at i
                        this._activated.splice(i, 0, { content, ref: this.activate(content) });
                    }
                    else if (activatedIndex > i) {
                        // move content from activatedIndex to i
                        const _activated = this._activated.splice(activatedIndex, 1);
                        this._activated.splice(i, 0, ..._activated);
                        const view = this._view.detach(activatedIndex);
                        this._view.insert(view, i);
                    }
                    else {
                        console.error('Logic error in FramingContainerOutlet!');
                    }
                }
            }
            else {
                // activate this content
                const ref = this.activate(content);
                if (ref) {
                    this._activated.push({ content, ref });
                }
            }
            i++;
        }
        this.onComponents.emit(this._activated.map((a) => a.ref));
    }
    activate(content, i) {
        try {
            const injector = (!this.useViewInjector && content.injector) ? content.injector : this._view.parentInjector;
            const factory = injector.get(ComponentFactoryResolver).resolveComponentFactory(content.component);
            let ref = this._view.createComponent(factory, i, injector, this.content);
            try {
                ref.changeDetectorRef.detectChanges();
            }
            catch (e) {
                console.error(`detectChanges failed on activated component in FramingContainerOutlet '${this.framingContainerOutlet}'`, { e, component: content.component });
            }
            return ref;
        }
        catch (e) {
            console.error(`Failed to activate component in FramingContainerOutlet '${this.framingContainerOutlet}'`, { e, component: content.component });
            return undefined;
        }
    }
    deactivate(activated) {
        activated.ref.destroy();
        activated.ref = null;
    }
};
__decorate$2([
    Input(),
    __metadata$1("design:type", String)
], FramingContainerOutletDirective.prototype, "framingContainerOutlet", void 0);
__decorate$2([
    Input(),
    __metadata$1("design:type", Boolean)
], FramingContainerOutletDirective.prototype, "optionalContainer", void 0);
__decorate$2([
    Input(),
    __metadata$1("design:type", Boolean)
], FramingContainerOutletDirective.prototype, "useViewInjector", void 0);
__decorate$2([
    Input(),
    __metadata$1("design:type", Array)
], FramingContainerOutletDirective.prototype, "content", void 0);
__decorate$2([
    Output(),
    __metadata$1("design:type", EventEmitter)
], FramingContainerOutletDirective.prototype, "onComponents", void 0);
FramingContainerOutletDirective = __decorate$2([
    Directive({
        selector: '[framingContainerOutlet]',
    }),
    __metadata$1("design:paramtypes", [ViewContainerRef,
        FramingContainerOutletService,
        Router])
], FramingContainerOutletDirective);

var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
let FramingContainerOutletModule = FramingContainerOutletModule_1 = class FramingContainerOutletModule {
    static withEntryComponents(...components) {
        return {
            ngModule: FramingContainerOutletModule_1,
            providers: [
                { provide: ANALYZE_FOR_ENTRY_COMPONENTS, useValue: components, multi: true },
            ],
        };
    }
    static forRoot() {
        return {
            ngModule: FramingContainerOutletModule_1,
            providers: [FramingContainerOutletService],
        };
    }
};
FramingContainerOutletModule = FramingContainerOutletModule_1 = __decorate$4([
    NgModule({
        declarations: [FramingContainerOutletDirective],
        exports: [FramingContainerOutletDirective],
    })
], FramingContainerOutletModule);
var FramingContainerOutletModule_1;

var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata$3 = (undefined && undefined.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
let FramingContainerOutletResolver = class FramingContainerOutletResolver {
    constructor(containers, injector) {
        this.containers = containers;
        this.injector = injector;
    }
    /**
     * Resolve hook.
     */
    resolve(route, state) {
        // set the injector in each container
        for (let container of this.containers) {
            container.injector = this.injector;
        }
        return this.containers;
    }
};
FramingContainerOutletResolver = __decorate$5([
    Injectable(),
    __metadata$3("design:paramtypes", [Array, Injector])
], FramingContainerOutletResolver);

var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/**
 * @experimental
 */
let FramingEmptyParentComponent = class FramingEmptyParentComponent {
};
FramingEmptyParentComponent = __decorate$6([
    Component({
        selector: 'empty-parent-component',
        template: '<router-outlet></router-outlet>',
    })
], FramingEmptyParentComponent);

var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
let FramingComponentsModule = class FramingComponentsModule {
};
FramingComponentsModule = __decorate$7([
    NgModule({
        imports: [
            RouterModule,
        ],
        declarations: [
            FramingEmptyParentComponent,
        ],
        exports: [
            FramingEmptyParentComponent,
        ],
    })
], FramingComponentsModule);

var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
let FramingRootComponent = class FramingRootComponent {
};
FramingRootComponent = __decorate$8([
    Component({
        selector: 'app',
        template: '<router-outlet></router-outlet>',
    })
], FramingRootComponent);

class Component$1 {
    constructor(controller, injector) {
        this.changeDetectorRef = injector.get(ChangeDetectorRef);
        controller.model$.subscribe((model) => {
            this.model = model;
            this.changeDetectorRef.markForCheck();
        });
        controller.view$.subscribe((view) => {
            this.view = view;
            this.changeDetectorRef.markForCheck();
        });
    }
}

var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
let Controller = class Controller {
    // ========================================
    // public methods
    // ========================================
    /**
     * Model observable accessor.
     */
    get model$() { return this._model$; }
    /**
     * View observable accessor.
     */
    get view$() { return this._view$; }
    /**
     * Model accessor.
     */
    get model() { return this._model; }
    /**
     * View accessor.
     */
    get view() { return this._view; }
    /**
     * Frame accessor.
     */
    get frame() { return this._frame; }
    /**
     * Model accessor.
     */
    get injector() { return this._injector; }
    /**
     * Called after controller is initialized with model, view & frame from framing.
     */
    onControllerInit() { }
    /**
     * Called when the controller's route starts resolving.
     */
    onResolveStart() { }
    /**
     * Called when the controller's route end resolving.
     */
    onResolveEnd() { }
    /**
     * Called when the controller's route resolve is cancelled.
     */
    onResolveCancel() { }
    /**
     * Called by framing after construction to link the model, view & frame for this controller.
     */
    initController(model, view, frame, injector) {
        this._modelSubject = new BehaviorSubject(model);
        this._viewSubject = new BehaviorSubject(view);
        this._model$ = this._modelSubject.asObservable();
        this._view$ = this._viewSubject.asObservable();
        this._model = model;
        this._view = view;
        this._frame = frame;
        this._injector = injector;
        if (this._frame) {
            this._frame.resolveStart$.subscribe(() => { this.onResolveStart(); });
            this._frame.resolveEnd$.subscribe(() => { this.onResolveEnd(); });
            this._frame.resolveCancel$.subscribe(() => { this.onResolveCancel(); });
        }
        this.onControllerInit();
    }
    updateModel(model, replace = false) {
        if (replace) {
            this._model = model;
        }
        else {
            this._model = assign({}, this._model, model);
        }
        this._modelSubject.next(this._model);
    }
    updateView(view, replace = false) {
        if (replace) {
            this._view = view;
        }
        else {
            this._view = assign({}, this._view, view);
        }
        this._view = view;
        this._viewSubject.next(this._view);
    }
};
Controller = __decorate$9([
    Injectable()
], Controller);

class Frame {
    constructor() {
        // ========================================
        // public properties
        // ========================================
        /**
         * Subjects
         */
        this.routeUrlSubject = new ReplaySubject$1();
        this.resolveStartSubject = new Subject();
        this.resolveEndSubject = new Subject();
        this.resolveCancelSubject = new Subject();
    }
    /**
     * An observable of the route url of the route that this controllerr is attached to, if any.
     */
    get routeUrl$() { return this.routeUrlSubject; }
    /**
     * Emitted when the frame resolve method starts if this controller is attached to a route.
     */
    get resolveStart$() { return this.resolveStartSubject; }
    /**
     * Emitted when the frame resolve method ends if this controller is attached to a route.
     */
    get resolveEnd$() { return this.resolveEndSubject; }
    /**
     * Emitted when the frame resolve method is cancelled if this controller is attached to a route.
     */
    get resolveCancel$() { return this.resolveCancelSubject; }
}

class FramerHelper {
    // ========================================
    // constructor
    // ========================================
    constructor() {
        this.framerHelperId = FramerHelper._nextId++;
    }
    /**
     * A unique identifier string for this framer helper instance.
     */
    get framerHelperIdent() {
        return camelCase(`framerHelper-${this.__proto__.constructor.name}-${this.framerHelperId}`);
    }
}
FramerHelper._nextId = 1;

/**
 * @description This is a description
 */
class Framer {
    // ========================================
    // constructor
    // ========================================
    /**
     * Contructor.
     */
    constructor(model, view, controller) {
        /**
         * True if framing() has been called.
         */
        this._framed = false;
        this.construct(model, view, controller);
    }
    /**
     * Model accessor.
     */
    get theModel() { return this._model; }
    /**
     * View accessor.
     */
    get theView() { return this._view; }
    /**
     * Controller accessor.
     */
    get theController() { return this._controller; }
    /**
     * When true, framing will create a frame for this framer.
     */
    get createFrame() { return true; }
    /**
     * When true, framing will use multi on all providers so multiple framers of the same type can be setup on the same module.
     */
    get multiFramer() { return false; }
    /**
     * When true, framing will setup the controller as a provider by its type.
     */
    get provideControllerByType() { return true; }
    /**
     * When true, framing will add the model to the route data.
     */
    get addModelToRouteData() { return false; }
    /**
     * When true, framing will add the view to the route data.
     */
    get addViewToRouteData() { return false; }
    /**
     * When true, framing will add the frame to the route data.
     */
    get addFrameToRouteData() { return false; }
    /**
     * The default model.
     */
    get defaultModel() { return undefined; }
    /**
     * The default view.
     */
    get defaultView() { return undefined; }
    /**
     * The default controller.
     */
    get defaultController() { return undefined; }
    /**
     * 'require': framing will attach the default route, creating it if it doesn't yet exist, if not route is attached to this framer (default behavior)
     * 'auto': framing will attach the default route if available if not route is attached to this framer
     * 'none': framing will not attach a route to this framer
     */
    get routeRule() { return 'require'; }
    /**
     * A unique framer id for this framer.
     */
    get framerId() { return this._framerId; }
    /**
     * A unique identifier string for this framer instance.
     */
    get framerIdent() { return `${this.framerName}Framer-${this._framerId}`; }
    /**
     * True if framing() has been called.
     */
    get framed() { return this._framed; }
    /**
     * The injector (available on and after framerOnResolveRoute or framerOnControllerInit, whichever comes first)
     */
    get injector() { return this._injector; }
    /**
     * The framer's route, if attached to a route, otherwise undefined
     * Valid ONLY during the runFraming() and framing() functions
     */
    get route() { return this._route; }
    // ========================================
    // public static methods
    // ========================================
    /**
     * Helper function to build the URL of an ActivatedRouteSnapshot
     */
    static buildUrlLink(route) {
        if (!route) {
            return '/';
        }
        let urls = [];
        /* tslint:disable:no-param-reassign */
        for (; route.parent; route = route.parent) {
            /* tslint:enable:no-param-reassign */
            urls = urls.concat(route.url.reverse());
        }
        urls = urls.reverse();
        return '/' + urls.join('/');
    }
    // ========================================
    // public methods
    // ========================================
    /**
     * Model chaining function.
     */
    model(model) {
        merge(this._model, model);
        return this;
    }
    /**
     * View chaining function.
     */
    view(view) {
        merge(this._view, view);
        return this;
    }
    /**
     * Controller chaining function.
     */
    controller(controller) {
        if (controller) {
            this._controller = controller;
        }
        return this;
    }
    /**
     * Framer on resolve route function called when framer's route is resolved.
     * Injector is set before during this call.
     * Not called if framer is not attached to a route.
     * To be overwritten if needed.
     */
    framerOnResolveRoute() { }
    /**
     * Framer on controller init function is called when the controller is first injected.
     * To be overwritten if needed.
     */
    framerOnControllerInit(controller) { }
    /**
     * Calls derived framing()
     */
    runFraming(framing, routeParam) {
        if (this._framed) {
            console.warn(`runFraming() called multiple times on framer '${this.framerIdent}'`);
            return;
        }
        this._framed = true; // mark this framer to framed
        if (this.routeRule === 'auto') {
            // set the framer's attached route (if any)
            this._route = routeParam;
        }
        else if (this.routeRule === 'require') {
            // set the framer's attached route to the supplied route or create one if it doesn not exist
            if (routeParam) {
                this._route = routeParam;
            }
            else {
                /* tslint:disable:no-param-reassign */
                this._route = routeParam = framing.getOrAddRoute();
                /* tslint:enable:no-param-reassign */
            }
        }
        this._framing = framing; // set _framing to framing ONLY for the duration of the controller() function
        try {
            this.frame(framing);
        }
        catch (e) {
            console.error(`Exception when framing ${this.framerIdent} :`, e);
            this._model = undefined;
            this._view = undefined;
            this._controller = undefined;
        }
        this._framing = undefined;
        if (this.routeRule === 'auto') {
            this._route = routeParam;
        }
        const self = this;
        if (this._controller) {
            // FUTURE
            // this.provideTypeByName(framing, this.framerName + 'Controller', this._controller);
            if (this.provideControllerByType) {
                let controllerInstance;
                framing
                    .provide({
                    provide: this.framerIdent + '-ControllerInternal',
                    useClass: this._controller,
                })
                    .provide({
                    provide: this.framerIdent + '-Controller',
                    useFactory: (injector) => {
                        if (controllerInstance) {
                            return controllerInstance;
                        }
                        self._injector = injector;
                        controllerInstance = injector.get(this.framerIdent + '-ControllerInternal');
                        controllerInstance.initController(this._model, this._view, this._frame, injector);
                        this.framerOnControllerInit(controllerInstance);
                        return controllerInstance;
                    },
                    deps: [Injector],
                })
                    .provide({
                    provide: this._controller,
                    useExisting: this.framerIdent + '-Controller',
                    multi: this.multiFramer && this._controller === this.defaultController,
                });
                /* tslint:disable:no-console */
                console.info(`Providing controller for framer ${this.framerIdent} by type`);
                /* tslint:enable:no-console */
                if (this.defaultController && this._controller !== this.defaultController) {
                    framing.provide({
                        provide: this.defaultController,
                        useExisting: this.framerIdent + '-Controller',
                        multi: this.multiFramer,
                    });
                    /* tslint:disable:no-console */
                    console.info(`Providing controller overload for framer ${this.framerIdent} by default controller type`);
                    /* tslint:enable:no-console */
                }
            }
        }
        // FUTURE: frame, model & view provided by name
        // this.provideValueByName(framing, this.framerName + 'Frame', this._frame);
        // this.provideValueByName(framing, this.framerName + 'Model', this._model);
        // this.provideValueByName(framing, this.framerName + 'View', this._view);
        // FUTURE: model & view provided by type
        // this.provideInstanceByType(framing, this._model);
        // this.provideInstanceByType(framing, this._view);
        if (this.route) {
            if (this.addFrameToRouteData) {
                this.addRouteData(framing, this.framerName + 'Frame', this._frame);
            }
            if (this.addModelToRouteData) {
                this.addRouteData(framing, this.framerName + 'Model', this._model);
            }
            if (this.addViewToRouteData) {
                this.addRouteData(framing, this.framerName + 'View', this._view);
            }
            if (this._frame) {
                class FrameResolver {
                    constructor(router, route, injector) {
                        this.router = router;
                        this.route = route;
                        self._injector = injector;
                    }
                    resolve(routeSnapshot, routeStateSnapshot) {
                        self._frame.resolveStartSubject.next();
                        const routeUrl = Framer.buildUrlLink(routeSnapshot);
                        const sub = this.router.events.subscribe((event) => {
                            if (event instanceof NavigationStart) {
                                console.error('Unexpected NavigationStart');
                            }
                            else if (event instanceof NavigationEnd) {
                                /* tslint:disable:no-console */
                                console.info(`Route url for framer ${self.framerIdent} changed to ${routeUrl}`);
                                /* tslint:enable:no-console */
                                self._frame.routeSnapshot = self.findActivateRouteSnapshot(this.route);
                                self._frame.routeUrl = routeUrl;
                                self._frame.routeUrlSubject.next(routeUrl);
                                self.framerOnResolveRoute();
                                self._frame.resolveEndSubject.next();
                            }
                            else if (event instanceof NavigationError) {
                                self._frame.resolveCancelSubject.next();
                            }
                            else if (event instanceof NavigationCancel) {
                                self._frame.resolveCancelSubject.next();
                            }
                            sub.unsubscribe();
                        });
                        return self._frame;
                    }
                }
                framing
                    .resolve(this.framerIdent, FrameResolver, this.route)
                    .provide({
                    provide: FrameResolver,
                    useFactory: (r, a, i) => new FrameResolver(r, a, i),
                    deps: [Router, ActivatedRoute, Injector]
                });
            }
        }
        this._route = undefined; // clear the route so we're not holding any references to its properties
    }
    /**
     * Protected construct function for derived construction help.
     */
    construct(model, view, controller) {
        this._framerId = Framer._nextId++;
        if (this.createFrame) {
            this._frame = new Frame();
        }
        const defaultModel = this.defaultModel;
        this._model = defaultModel ? merge(defaultModel, model) : model;
        const defaultView = this.defaultView;
        this._view = defaultView ? merge(defaultView, view) : view;
        this._controller = controller || this.defaultController;
    }
    /**
     * Protected construct function for derived construction help.
     */
    findActivateRouteSnapshot(route) {
        if (!route) {
            console.error('Failed to find activated route snapshot');
            return undefined;
        }
        if (route.snapshot && route.snapshot.data && route.snapshot.data.hasOwnProperty(this.framerIdent)) {
            return route.snapshot;
        }
        return this.findActivateRouteSnapshot(route.firstChild);
    }
    /**
     * FUTURE
     */
    // private provideTypeByName(framing: FramingNgModule, name: string, type: any): void {
    //   if (type) {
    //     framing.provide({ provide: name, useClass: type });
    //     /* tslint:disable:no-console */
    //     console.info(`Providing ${name} for framer ${this.framerIdent} by name`);
    //     /* tslint:enable:no-console */
    //   }
    // }
    /**
     * FUTURE
     */
    // private provideInstanceByType(framing: FramingNgModule, instance: any): void {
    //   if (instance &&
    //     (instance as any).__proto__ &&
    //     (instance as any).__proto__.constructor &&
    //     (instance as any).__proto__.constructor.name !== 'Object') {
    //     framing.provide({ provide: (instance as any).__proto__.constructor, useValue: instance });
    //     /* tslint:disable:no-console */
    //     console.info(`Providing ${(instance as any).__proto__.constructor.name} for framer ${this.framerIdent} by type`);
    //     /* tslint:enable:no-console */
    //   }
    // }
    /**
     * FUTURE
     */
    // private provideValueByName(framing: FramingNgModule, name: string, value: any): void {
    //   if (value) {
    //     framing.provide({ provide: name, useValue: value });
    //     /* tslint:disable:no-console */
    //     console.info(`Providing ${name} for framer ${this.framerIdent} by name`);
    //     /* tslint:enable:no-console */
    //   }
    // }
    addRouteData(framing, name, value) {
        if (value) {
            const routeConfig = framing.getOrAddRoute(this.route);
            if (routeConfig.data && routeConfig.data[name]) {
                console.warn(`Failed to add ${name} route data for framer ${this.framerIdent}. Data item already exists.`);
            }
            else {
                framing.datum(name, value, this.route);
                /* tslint:disable:no-console */
                console.info(`Adding ${name} route data for framer ${this.framerIdent}`);
                /* tslint:enable:no-console */
            }
        }
    }
}
Framer._nextId = 1;

/**
 *
 */
class FramingNgModule {
    constructor() {
        // ========================================
        // private properties
        // ========================================
        this._ngModule = {
            imports: [],
            declarations: [],
            exports: [],
            providers: [],
            bootstrap: [],
            entryComponents: [],
        };
        this._root = false;
        this._routes = [];
    }
    static get defaultPathMatch() { return 'prefix'; }
    // ========================================
    // public methods
    // ========================================
    ngModule(ngModule) {
        if (ngModule) {
            defaults(this._ngModule, ngModule);
            each(filter(keys(ngModule), (key) => { return isArray(ngModule[key]); }), (key) => {
                this._ngModule[key] = uniqWith(this._ngModule[key].concat(reject(ngModule[key], isNil)), isEqual);
            });
        }
        return this;
    }
    child(child, parent) {
        let parentRoute = this.getOrAddRouteOverload(parent);
        if (!parentRoute.children) {
            parentRoute.children = [];
        }
        if (!parentRoute.component) {
            parentRoute.component = FramingEmptyParentComponent;
        }
        this.getOrAddRoute(child, parentRoute.children);
        return this;
    }
    children(children, parent) {
        each(children, (child) => {
            this.child(child, parent);
        });
        return this;
    }
    component(component, route) {
        if (component) {
            let routeConfig = this.getOrAddRouteOverload(route);
            routeConfig.component = component;
        }
        return this;
    }
    componentAndDeclare(component, route) {
        return this.componentAndDeclaration(component, route);
    }
    componentAndDeclaration(component, route) {
        this.component(component, route);
        if (component) {
            this.declare(component);
        }
        return this;
    }
    container(container, components, route) {
        let containers = {};
        containers[container] = components;
        this.containers(containers, route);
        return this;
    }
    containers(containers, route) {
        for (let key in containers) {
            if (containers.hasOwnProperty(key)) {
                if (isNil(containers[key])) {
                    delete containers[key];
                }
            }
        }
        const routeConfig = this.getOrAddRoute(route);
        if (!routeConfig.resolve) {
            routeConfig.resolve = {};
        }
        if (!routeConfig.resolve.containers) {
            routeConfig.resolve.containers = [];
        }
        for (let key in containers) {
            if (containers.hasOwnProperty(key)) {
                const components = containers[key];
                if (isArray(components)) {
                    for (const component of components) {
                        routeConfig.resolve.containers.push({ container: key, component });
                    }
                }
                else {
                    routeConfig.resolve.containers.push({ container: key, component: components });
                }
            }
        }
        return this;
    }
    datum(key, datum, route) {
        let data = {};
        data[key] = datum;
        this.data(data, route);
        return this;
    }
    data(data, route) {
        let routeConfig = this.getOrAddRouteOverload(route);
        if (!routeConfig.data) {
            routeConfig.data = {};
        }
        merge(routeConfig.data, data);
        return this;
    }
    resolve(key, resolve, route) {
        let resolves = {};
        resolves[key] = resolve;
        this.resolves(resolves, route);
        return this;
    }
    resolves(resolves, route) {
        let routeConfig = this.getOrAddRouteOverload(route);
        if (!routeConfig.resolve) {
            routeConfig.resolve = {};
        }
        merge(routeConfig.resolve, resolves);
        return this;
    }
    declare(declaration) {
        return this.declaration(declaration);
    }
    declaration(declaration) {
        return this.declarations(isArray(declaration) ? declaration : [declaration]);
    }
    declarations(declarations) {
        const flattened = [].concat.apply([], declarations);
        this._ngModule.declarations = uniqWith(this._ngModule.declarations.concat(reject(flattened, isNil)), isEqual);
        return this;
    }
    declareAndExport(declaration) {
        return this.declarationAndExport(declaration);
    }
    declarationAndExport(declaration) {
        return this.declarationsAndExports(isArray(declaration) ? declaration : [declaration]);
    }
    declarationsAndExports(declarations) {
        this.declarations(declarations);
        this.exports(declarations);
        return this;
    }
    declareAndEntryComponent(declaration) {
        return this.declarationAndEntryComponent(declaration);
    }
    declarationAndEntryComponent(declaration) {
        return this.declarationsAndEntryComponents(isArray(declaration) ? declaration : [declaration]);
    }
    declarationsAndEntryComponents(declarations) {
        this.declarations(declarations);
        this.entryComponents(declarations);
        return this;
    }
    entryComponent(entryComponent) {
        return this.entryComponents(isArray(entryComponent) ? entryComponent : [entryComponent]);
    }
    entryComponents(entryComponents) {
        const flattened = [].concat.apply([], entryComponents);
        this._ngModule.entryComponents = uniqWith(this._ngModule.entryComponents.concat(reject(flattened, isNil)), isEqual);
        return this;
    }
    export(e) {
        return this.exports(isArray(e) ? e : [e]);
    }
    exports(exports) {
        const flattened = [].concat.apply([], exports);
        this._ngModule.exports = uniqWith(this._ngModule.exports.concat(reject(flattened, isNil)), isEqual);
        return this;
    }
    import(i) {
        return this.imports(isArray(i) ? i : [i]);
    }
    imports(imports) {
        const flattened = [].concat.apply([], imports);
        this._ngModule.imports = uniqWith(this._ngModule.imports.concat(reject(flattened, isNil)), isEqual);
        return this;
    }
    importAndExport(m) {
        return this.importsAndExports(isArray(m) ? m : [m]);
    }
    importsAndExports(modules) {
        this.imports(modules);
        this.exports(modules);
        return this;
    }
    provide(provider) {
        return this.provider(provider);
    }
    provider(provider) {
        return this.providers(isArray(provider) ? provider : [provider]);
    }
    providers(providers) {
        const flattened = [].concat.apply([], providers);
        this._ngModule.providers = uniqWith(this._ngModule.providers.concat(reject(flattened, isNil)), isEqual);
        return this;
    }
    /**
     * Adds component to bootstrap
     * Defaults route to path '', pathMatch: 'full'
     */
    root(rootComponent, config) {
        this._root = true;
        this._rootComponentConfig = config || {};
        defaults(this._rootComponentConfig, { hybrid: false });
        this._rootComponent = rootComponent || FramingRootComponent;
        return this;
    }
    /**
     * Creates Routes array with single route
     * Adds RouterModule.forRoot(routes) or RouterModule.forChild(routes) to imports
     * Adds all resolve services as providers
     */
    route(route, config) {
        this.getOrAddRoute(route);
        if (this._routeConfig) {
            if (config) {
                merge(this._routeConfig, config);
            }
        }
        else {
            this._routeConfig = config || {};
            defaults(this._routeConfig, { forRoot: false });
        }
        return this;
    }
    routes(routes, config) {
        each(routes, (route) => {
            this.route(route, config);
        });
        return this;
    }
    frameRoute(route, ...framers) {
        this.buildFramers(framers, this.getOrAddRouteOverload(route));
        return this;
    }
    /**
     * Returns the route if it exists.
     */
    getRoute(route = {}, array) {
        /* tslint:disable:no-param-reassign */
        if (!array) {
            array = this._routes;
        }
        /* tslint:enable:no-param-reassign */
        defaults(route, { path: '', pathMatch: FramingNgModule.defaultPathMatch });
        return find(array, (m) => { return m.path === route.path && m.pathMatch === route.pathMatch; });
    }
    /**
     * Returns the route. Creates it if it does not exist.
     */
    getOrAddRoute(route = {}, array) {
        /* tslint:disable:no-param-reassign */
        if (!array) {
            array = this._routes;
        }
        /* tslint:enable:no-param-reassign */
        defaults(route, { path: '', pathMatch: FramingNgModule.defaultPathMatch });
        let r = find(array, (m) => { return m.path === route.path && m.pathMatch === route.pathMatch; });
        if (r) {
            merge(r, route);
            return r;
        }
        else {
            array.push(route);
            return route;
        }
    }
    /**
     * Run framers.
     */
    frame(...framers) {
        this.buildFramers(framers);
        return this;
    }
    /**
     * Builds @NgModule() config in the following order:
     * - Route framers
     * - Root
     * - Route
     */
    build() {
        this.buildRouteFramers(this._routes);
        this.buildRoot();
        this.buildContainers(this._routes);
        this.buildRoute();
        this.inspectModule();
        return this._ngModule;
    }
    // ========================================
    // private methods
    // ========================================
    inspectModule() {
        this._routes.forEach((r) => this.inspectRoute(r));
    }
    inspectRoute(route) {
        if (route.component === undefined && route.redirectTo === undefined && isEmpty(route.children) && route.loadChildren === undefined) {
            console.error(`Looks like you have a badly configured route in a framed module.
        One of the following must be provided: component, redirectTo, children or loadChildren`, { route, self: this });
        }
        if (route.children) {
            route.children.forEach((c) => this.inspectRoute(c));
        }
    }
    buildRoot() {
        let m = this._ngModule;
        if (this._root) {
            m.imports = uniqWith(m.imports.concat([
                BrowserModule.withServerTransition({
                    appId: 'app',
                }),
                FormsModule,
            ]), isEqual);
            m.declarations = uniqWith(m.declarations.concat([this._rootComponent]), isEqual);
            if (this._rootComponentConfig.hybrid) {
                m.entryComponents = uniqWith(m.entryComponents.concat([this._rootComponent]), isEqual);
            }
            else {
                m.bootstrap = uniqWith(m.bootstrap.concat([this._rootComponent]), isEqual);
            }
        }
        else {
            m.imports = uniqWith(m.imports.concat([
                CommonModule,
            ]), isEqual);
        }
        m.imports = uniqWith(m.imports.concat([FramingComponentsModule]), isEqual);
    }
    buildFramers(framers, route) {
        for (let framer of framers) {
            this.buildFramer(framer, route);
        }
    }
    buildFramer(framer, route) {
        if (!framer.framed) {
            framer.runFraming(this, route || this.getRoute());
        }
    }
    /**
     * Builds framers that were manually added to route data.
     */
    buildRouteFramers(routes) {
        for (let route of routes) {
            if (route.data) {
                for (let key in route.data) {
                    if (route.data.hasOwnProperty(key)) {
                        let prop = route.data[key];
                        if (prop && prop._frame !== undefined) {
                            // this is a framer attached to route data
                            this.buildFramer(prop, route);
                        }
                    }
                }
            }
            if (route.children) {
                this.buildRouteFramers(route.children);
            }
        }
    }
    buildContainers(routes) {
        for (let route of routes) {
            if (route.resolve && route.resolve.containers) {
                const containers = route.resolve.containers;
                for (const container of containers) {
                    const containerId = FramingNgModule._nextId++;
                    container.id = '' + containerId;
                }
                const resolveId = FramingNgModule._nextId++;
                this.provide({
                    provide: 'containerResolver' + resolveId,
                    useFactory: (i) => new FramingContainerOutletResolver(containers, i),
                    deps: [Injector],
                });
                route.resolve.containers = 'containerResolver' + resolveId;
            }
            if (route.children) {
                this.buildContainers(route.children);
            }
        }
    }
    buildRoute() {
        if (this._routes.length > 0) {
            // re-order routes so that full routes are first
            let fullRoutes = [];
            let prefixRoutes = [];
            this._routes.forEach((route) => {
                if (route.pathMatch && route.pathMatch === 'full') {
                    fullRoutes.push(route);
                }
                else if (!route.pathMatch || route.pathMatch === 'prefix') {
                    prefixRoutes.push(route);
                }
                else {
                    console.warn('Unknown pathMatch on route', route);
                }
                this._routes = [];
                this._routes = this._routes.concat(fullRoutes);
                this._routes = this._routes.concat(prefixRoutes);
            });
            const routing = this._root || (this._routeConfig && this._routeConfig.forRoot) ?
                RouterModule.forRoot(this._routes, this._routeConfig ? this._routeConfig.extraRootRouterOptions : undefined) :
                RouterModule.forChild(this._routes);
            this.imports([routing]);
            if (this._routeConfig && this._routeConfig.forRoot && !this._root) {
                this.exports([RouterModule]); // export RouterModule from AppRoutingModule
            }
        }
    }
    getOrAddRouteOverload(route) {
        if (isArray(route)) {
            if (route.length) {
                let result;
                /* tslint:disable:prefer-for-of */
                result = this.getOrAddRoute(route[0]);
                for (let i = 1; i < route.length; i++) {
                    if (!result.children) {
                        result.children = [];
                    }
                    result = this.getOrAddRoute(route[i], result.children);
                }
                /* tslint:enable:prefer-for-of */
                return result;
            }
            else {
                return this.getOrAddRoute();
            }
        }
        else {
            return this.getOrAddRoute(route);
        }
    }
}
FramingNgModule._nextId = 1;

/* tslint:disable:variable-name */
const Framing = (ngModuleBuilder) => {
    /* tslint:enable:variable-name */
    let framing = ngModuleBuilder(new FramingNgModule());
    if (!framing) {
        console.error('Framing must return a FramingNgModule');
        return {};
    }
    return framing.build();
};

/**
 * A framer with no route, model, view, controller or frame.
 * To be used for leveraging the frame() function only.
 */
class SimpleFramer extends Framer {
    get framerName() { return 'Simple'; }
    get createFrame() { return false; }
    get routeRule() { return 'none'; }
}

export { FramingComponentOutletDirective, FramingComponentOutletModule, FramingContainerOutletDirective, FramingContainerOutletModule, FramingContainerOutletResolver, FramingContainerOutletService, FramingEmptyParentComponent, FramingComponentsModule, FramingRootComponent, Component$1 as Component, Controller, Frame, FramerHelper, Framer, FramingNgModule, Framing, SimpleFramer };
//# sourceMappingURL=ng-core.js.map