@veloceapps/sdk 4.0.21-0

package/fesm2015/veloceapps-sdk-cms.js

@@ -0,0 +1,1357 @@
+import { __decorate, __param, __awaiter, __rest } from 'tslib';
+import * as i0 from '@angular/core';
+import { InjectionToken, Component, ChangeDetectionStrategy, Inject, Injector, Injectable, Directive, ViewContainerRef, SkipSelf, ViewChild, Input, NgModule, ViewEncapsulation } from '@angular/core';
+import * as rxjs from 'rxjs';
+import { BehaviorSubject, Subject, takeUntil, map, filter, from, tap, of, switchMap, forkJoin, catchError } from 'rxjs';
+import * as lodash from 'lodash';
+import { compact, isArray, pull, flatten, set } from 'lodash';
+import * as i7 from '@angular/common';
+import { DOCUMENT, CommonModule } from '@angular/common';
+import { UUID, CoreModule } from '@veloceapps/core';
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import * as angularForms from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import * as i2 from '@veloceapps/sdk/core';
+import { ConfigurationService, LineItemWorker, generateLineItem, getAttributeValue, QuoteDraftService, FlowConfigurationService, ProductImagesService, lineItemUtils, SdkCoreModule } from '@veloceapps/sdk/core';
+import * as i1 from '@veloceapps/components';
+import { LoaderModule } from '@veloceapps/components';
+import { transform } from '@babel/standalone';
+import { SalesforceApiService, QuoteApiService, DocumentTemplatesApiService, DocumentAttachmentApiService, RampApiService, CatalogApiService, DeltaApiService, PicklistsApiService, PriceApiService, ApiModule } from '@veloceapps/api';
+import * as rxjsOperators from 'rxjs/operators';
+import * as i3 from 'primeng/api';
+import { DialogService } from 'primeng/dynamicdialog';
+
+var FlowAction;
+(function (FlowAction) {
+    FlowAction["FLOW_CONFIGURE_PRODUCT"] = "FLOW_CONFIGURE_PRODUCT";
+    FlowAction["FLOW_NAVIGATE_BACK"] = "FLOW_NAVIGATE_BACK";
+    FlowAction["FLOW_NAVIGATE_TO_CATALOG"] = "FLOW_NAVIGATE_TO_CATALOG";
+    FlowAction["FLOW_APPLY_PRODUCT_CONFIGURATION"] = "FLOW_APPLY_PRODUCT_CONFIGURATION";
+    FlowAction["FLOW_OPEN_DOC_GEN"] = "FLOW_OPEN_DOC_GEN";
+    FlowAction["FLOW_CLOSE_DOC_GEN"] = "FLOW_CLOSE_DOC_GEN";
+    FlowAction["REMOTE_APPLY"] = "REMOTE_APPLY";
+    FlowAction["REMOTE_CANCEL"] = "REMOTE_CANCEL";
+})(FlowAction || (FlowAction = {}));
+const ConfigureProductAction = ({ lineItemId, productId, }) => ({
+    type: FlowAction.FLOW_CONFIGURE_PRODUCT,
+    payload: { lineItemId, productId },
+});
+const NavigateBackAction = () => ({
+    type: FlowAction.FLOW_NAVIGATE_BACK,
+});
+const NavigateToCatalogAction = () => ({
+    type: FlowAction.FLOW_NAVIGATE_TO_CATALOG,
+});
+const ApplyProductConfigurationAction = () => ({
+    type: FlowAction.FLOW_APPLY_PRODUCT_CONFIGURATION,
+});
+const OpenDocGenAction = () => ({
+    type: FlowAction.FLOW_OPEN_DOC_GEN,
+});
+const CloseDocGenAction = () => ({
+    type: FlowAction.FLOW_CLOSE_DOC_GEN,
+});
+const RemoteApplyAction = () => ({
+    type: FlowAction.REMOTE_APPLY,
+});
+const RemoteCancelAction = () => ({
+    type: FlowAction.REMOTE_CANCEL,
+});
+
+var cmsActions = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    get FlowAction () { return FlowAction; },
+    ConfigureProductAction: ConfigureProductAction,
+    NavigateBackAction: NavigateBackAction,
+    NavigateToCatalogAction: NavigateToCatalogAction,
+    ApplyProductConfigurationAction: ApplyProductConfigurationAction,
+    OpenDocGenAction: OpenDocGenAction,
+    CloseDocGenAction: CloseDocGenAction,
+    RemoteApplyAction: RemoteApplyAction,
+    RemoteCancelAction: RemoteCancelAction
+});
+
+const DEFAULT_PLUGINS_TOKEN = new InjectionToken('DEFAULT_PLUGINS_TOKEN');
+const UI_DEFINITION_METADATA = new InjectionToken('UI_DEFINITION_METADATA_TOKEN');
+const ELEMENT_METADATA = new InjectionToken('ELEMENT_METADATA_TOKEN');
+const SHARED_ELEMENT_METADATA = new InjectionToken('SHARED_ELEMENT_METADATA_TOKEN');
+const ELEMENT_CONFIG = new InjectionToken('ELEMENT_CONFIG_TOKEN');
+const VENDOR_MAP = new InjectionToken('VENDOR_MAP');
+
+var cmsInjectionTokens = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    DEFAULT_PLUGINS_TOKEN: DEFAULT_PLUGINS_TOKEN,
+    UI_DEFINITION_METADATA: UI_DEFINITION_METADATA,
+    ELEMENT_METADATA: ELEMENT_METADATA,
+    SHARED_ELEMENT_METADATA: SHARED_ELEMENT_METADATA,
+    ELEMENT_CONFIG: ELEMENT_CONFIG,
+    VENDOR_MAP: VENDOR_MAP
+});
+
+class Entity {
+    constructor(injector) {
+        this.injector = injector;
+        this.plugins = [];
+        this.config = this.injector.get(ELEMENT_CONFIG);
+        this.defaultPlugins = this.injector.get(DEFAULT_PLUGINS_TOKEN);
+    }
+    initPlugins() {
+        var _a;
+        this.defaultPlugins.forEach(plugin => this.registerPlugin(new plugin(this)));
+        (_a = this.config.plugins) === null || _a === void 0 ? void 0 : _a.forEach(plugin => this.registerPlugin(new plugin(this)));
+    }
+    registerPlugin(plugin) {
+        this.plugins.push(plugin);
+    }
+}
+
+let ElementComponent = class ElementComponent extends Entity {
+    constructor(injector) {
+        super(injector);
+        this.injector = injector;
+        this.model$ = new BehaviorSubject(undefined);
+        super.initPlugins();
+    }
+    ngOnChanges(changes) {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngOnChanges) === null || _a === void 0 ? void 0 : _a.call(plugin, changes); });
+    }
+    ngOnInit() {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngOnInit) === null || _a === void 0 ? void 0 : _a.call(plugin); });
+    }
+    ngDoCheck() {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngDoCheck) === null || _a === void 0 ? void 0 : _a.call(plugin); });
+    }
+    ngAfterContentInit() {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngAfterContentInit) === null || _a === void 0 ? void 0 : _a.call(plugin); });
+    }
+    ngAfterViewInit() {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngAfterViewInit) === null || _a === void 0 ? void 0 : _a.call(plugin); });
+    }
+    ngAfterViewChecked() {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngAfterViewChecked) === null || _a === void 0 ? void 0 : _a.call(plugin); });
+    }
+    ngOnDestroy() {
+        this.plugins.forEach(plugin => { var _a; return (_a = plugin.ngOnDestroy) === null || _a === void 0 ? void 0 : _a.call(plugin); });
+    }
+};
+ElementComponent = __decorate([
+    Component({
+        template: '',
+        changeDetection: ChangeDetectionStrategy.OnPush,
+        jit: true,
+    }),
+    __param(0, Inject(Injector))
+], ElementComponent);
+
+const parseBoundPath = (path) => {
+    var _a, _b;
+    const regexp = new RegExp(`(?:\\/)(?:\\w+)(?:\\/)(?:ports|attributes)(?:\\/)(?:\\w+)|(?:\\/)(?:\\w+)`, 'g');
+    const blocks = (_b = (_a = path.match(regexp)) === null || _a === void 0 ? void 0 : _a.map(match => {
+        const [type, property, name] = compact(match.split('/'));
+        return { type, property, name };
+    })) !== null && _b !== void 0 ? _b : [];
+    return blocks;
+};
+const parsePath = (path) => {
+    var _a, _b, _c, _d;
+    const segments = path.split('/');
+    let module;
+    let variable;
+    if ((_a = segments[0]) === null || _a === void 0 ? void 0 : _a.startsWith('@')) {
+        module = (_b = segments.shift()) === null || _b === void 0 ? void 0 : _b.substring(1);
+    }
+    if (((_c = segments[segments.length - 1]) === null || _c === void 0 ? void 0 : _c[0]) === ':') {
+        variable = (_d = segments.pop()) === null || _d === void 0 ? void 0 : _d.substring(1);
+    }
+    const isAbsolute = !segments[0];
+    const nonEmptySegments = segments.filter(Boolean);
+    if (!isAbsolute && nonEmptySegments[0] === '.') {
+        nonEmptySegments.shift();
+    }
+    return {
+        isAbsolute,
+        segments: nonEmptySegments,
+        module,
+        variable,
+    };
+};
+const findElementByModule = (elements, module, elementName) => {
+    for (const el of elements) {
+        if (el.module === module && el.name === elementName) {
+            return el;
+        }
+        const child = findElementByModule(el.children, module, elementName);
+        if (child) {
+            return child;
+        }
+    }
+    return;
+};
+const getAbsolutePath = (elements, subject, path) => {
+    var _a, _b, _c;
+    if (path.module) {
+        return (_a = findElementByModule(elements, path.module, path.segments[0])) === null || _a === void 0 ? void 0 : _a.path;
+    }
+    const subjectSegments = (_c = (_b = subject.path) === null || _b === void 0 ? void 0 : _b.split('/')) !== null && _c !== void 0 ? _c : [];
+    const segments = [...path.segments];
+    if (path.isAbsolute) {
+        return segments.join('/');
+    }
+    while (segments.length) {
+        const segment = segments.shift();
+        if (segment === '..') {
+            subjectSegments.pop();
+        }
+        else if (segment) {
+            subjectSegments.push(segment);
+        }
+    }
+    return subjectSegments.join('/');
+};
+
+class DynamicModuleService {
+    constructor() {
+        this._elementsTree = [];
+        this._componentFactories = [];
+    }
+    set componentFactories(data) {
+        this._componentFactories = data;
+    }
+    get componentFactories() {
+        return this._componentFactories;
+    }
+    getComponentFactory(element) {
+        return this.componentFactories.find(f => f.componentType.path === element.path);
+    }
+    get elementsTree() {
+        return this._elementsTree;
+    }
+    set elementsTree(tree) {
+        this._elementsTree = tree;
+    }
+    clear() {
+        this._elementsTree = [];
+        this.componentFactories = [];
+    }
+}
+DynamicModuleService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DynamicModuleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DynamicModuleService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DynamicModuleService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DynamicModuleService, decorators: [{
+            type: Injectable
+        }] });
+
+class IOProviderService {
+    constructor(dynamicModuleService) {
+        this.dynamicModuleService = dynamicModuleService;
+        this.inputs = {};
+    }
+    connect(el, name, target) {
+        var _a;
+        return (_a = this.resolveTarget(el, name, target)) === null || _a === void 0 ? void 0 : _a.asObservable();
+    }
+    provide(el, name, target) {
+        return this.resolveTarget(el, name, target);
+    }
+    resolveTarget(el, name, target) {
+        var _a, _b;
+        const isHost = !target;
+        if (isHost) {
+            return this.createSubjectSafe((_a = el.path) !== null && _a !== void 0 ? _a : '', name);
+        }
+        const elPath = parsePath(target);
+        const pathIsValue = elPath.segments.length === 1 && elPath.segments[0].startsWith('"') && elPath.segments[0].endsWith('"');
+        const finalName = (_b = elPath.variable) !== null && _b !== void 0 ? _b : name;
+        const value = pathIsValue ? new BehaviorSubject(elPath.segments[0].slice(1, -1)) : undefined;
+        const absolutePath = !pathIsValue ? getAbsolutePath(this.dynamicModuleService.elementsTree, el, elPath) : el.path;
+        return this.createSubjectSafe(absolutePath !== null && absolutePath !== void 0 ? absolutePath : '', finalName, value);
+    }
+    createSubjectSafe(path, name, subject) {
+        if (!this.inputs[path]) {
+            this.inputs[path] = {};
+        }
+        const subjectAlreadyExists = Boolean(this.inputs[path][name]);
+        if (!this.inputs[path][name]) {
+            this.inputs[path][name] = subject !== null && subject !== void 0 ? subject : new BehaviorSubject(undefined);
+        }
+        if (subject && subjectAlreadyExists) {
+            // push delayed value to workaround 'changed after it was checked' issue
+            setTimeout(() => this.inputs[path][name].next(subject.value));
+        }
+        return this.inputs[path][name];
+    }
+}
+IOProviderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IOProviderService, deps: [{ token: DynamicModuleService }], target: i0.ɵɵFactoryTarget.Injectable });
+IOProviderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IOProviderService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IOProviderService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: DynamicModuleService }]; } });
+
+class TemplatesService {
+    constructor() {
+        this.templates = {};
+    }
+    register(name, templateRef) {
+        this.ensureStorage(name);
+        this.templates[name].next(templateRef);
+    }
+    get(name) {
+        this.ensureStorage(name);
+        return this.templates[name].value;
+    }
+    get$(name) {
+        this.ensureStorage(name);
+        return this.templates[name].asObservable();
+    }
+    ensureStorage(name) {
+        if (!this.templates[name]) {
+            this.templates[name] = new BehaviorSubject(undefined);
+        }
+    }
+}
+TemplatesService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TemplatesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+TemplatesService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TemplatesService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TemplatesService, decorators: [{
+            type: Injectable
+        }] });
+
+class IOPlugin {
+    constructor(host) {
+        var _a, _b;
+        this.host = host;
+        const elementMetadata = this.host.injector.get(ELEMENT_METADATA);
+        const inputProvider = this.host.injector.get(IOProviderService);
+        const inputs = Object.entries((_a = elementMetadata.inputs) !== null && _a !== void 0 ? _a : {});
+        const outputs = Object.entries((_b = elementMetadata.outputs) !== null && _b !== void 0 ? _b : {});
+        inputs.forEach(([key, path]) => {
+            var _a;
+            if (path && typeof path !== 'string') {
+                console.error(`The value of '${key}' input should be a string`);
+            }
+            if (((_a = elementMetadata.outputs) === null || _a === void 0 ? void 0 : _a[key]) !== undefined) {
+                console.warn(`'${key}' appears both in inputs and outputs. To prevent inconsistent behavior please keep them unique `);
+            }
+            this.host[key] = inputProvider.connect(elementMetadata, key, path);
+        });
+        outputs.forEach(([key, path]) => {
+            if (path && typeof path !== 'string') {
+                console.error(`The value of '${key}' output should be a string`);
+            }
+            this.host[key] = inputProvider.provide(elementMetadata, key, path);
+        });
+    }
+}
+IOPlugin.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IOPlugin, deps: [{ token: ElementComponent }], target: i0.ɵɵFactoryTarget.Directive });
+IOPlugin.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: IOPlugin, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IOPlugin, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: ElementComponent }]; } });
+
+class ScriptPlugin {
+    constructor(host) {
+        this.host = host;
+        this.normalizeImports = (script, elementPath) => {
+            const regexp = new RegExp(`import([ \\n\\t]*(?:[^ \\n\\t\\{\\}]+[ \\n\\t]*,?)?(?:[ \\n\\t]*\\{(?:[ \\n\\t]*[^ \\n\\t"'\\{\\}]+[ \\n\\t]*,?)+\\})?[ \\n\\t]*)from[ \\n\\t]*(['"])([^'"\\n]+)(?:['"]);`, 'g');
+            const result = script.replace(regexp, (match, g1, g2, src) => {
+                const imports = g1
+                    .trim()
+                    .slice(1, -1)
+                    .split(',')
+                    .map(item => item.trim());
+                imports.forEach(item => {
+                    var _a;
+                    if (!((_a = this.vendorMap[src]) === null || _a === void 0 ? void 0 : _a[item])) {
+                        throw new Error(`Failed to import ${item} from '${src}' in ${elementPath}/script.ts`);
+                    }
+                });
+                return `const ${g1} = vendor['${src}'];`;
+            });
+            return result;
+        };
+        this.document = this.host.injector.get(DOCUMENT);
+        this.vendorMap = this.host.injector.get(VENDOR_MAP);
+        const elementMetadata = this.host.injector.get(ELEMENT_METADATA);
+        const sharedElementMetadata = this.host.injector.get(SHARED_ELEMENT_METADATA);
+        this.addScript(sharedElementMetadata);
+        this.addScript(elementMetadata);
+    }
+    addScript(metadata) {
+        var _a;
+        if (!(metadata === null || metadata === void 0 ? void 0 : metadata.script)) {
+            return;
+        }
+        const id = btoa(UUID.UUID());
+        const script = this.document.createElement('script');
+        script.type = `text/javascript`;
+        let scriptContent = this.normalizeImports(metadata.script, (_a = metadata.path) !== null && _a !== void 0 ? _a : metadata.name);
+        const classMatch = /export class (\S+)/.exec(scriptContent);
+        const className = classMatch === null || classMatch === void 0 ? void 0 : classMatch[1];
+        if (!classMatch || !className) {
+            console.error("Script doesn't have exported class");
+            return;
+        }
+        scriptContent = scriptContent.replace(classMatch[0], `class ${className}`);
+        script.text = `var ${id} = function(vendor) {${scriptContent}
+        return ${className}; };`;
+        this.document.body.appendChild(script);
+        const ScriptClass = window[id](this.vendorMap);
+        if (ScriptClass instanceof Object) {
+            this.host.registerPlugin(new ScriptClass(this.host));
+        }
+        this.document.body.removeChild(script);
+    }
+}
+ScriptPlugin.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ScriptPlugin, deps: [{ token: ElementComponent }], target: i0.ɵɵFactoryTarget.Directive });
+ScriptPlugin.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: ScriptPlugin, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ScriptPlugin, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: ElementComponent }]; } });
+
+/*
+ * ScriptPlugin must always be the last plugin in the list to make sure user code is running after all pre-initializers.
+ */
+const CONFIG = {
+    CUSTOM: {
+        component: ElementComponent,
+        plugins: [IOPlugin, ScriptPlugin],
+    },
+    CONTAINER: {
+        component: ElementComponent,
+        defaultTemplate: '<element-children></element-children>',
+        plugins: [ScriptPlugin],
+    },
+    SERVICE: {
+        component: ElementComponent,
+        plugins: [IOPlugin, ScriptPlugin],
+        suppressTemplate: true,
+        suppressStyles: true,
+    },
+    REFERENCE: {
+        component: ElementComponent,
+        plugins: [IOPlugin, ScriptPlugin],
+        suppressTemplate: true,
+    },
+};
+
+const EXPORTED_CLASS_REGEX = /export class (\S+)/;
+const METADATA_DECORATOR_REGEX = /@ElementDefinition\(([\s\S]+)\)(\n|\r\n|.)*export class/g;
+class UiBuildError extends Error {
+    constructor(message, affectedMetadata) {
+        super(message);
+        this.name = this.constructor.name;
+        this.affectedMetadata = affectedMetadata;
+    }
+}
+const elementToMetadata = (el, parentPath) => {
+    var _a;
+    const script = el.script && window.atob(el.script);
+    const template = el.template && window.atob(el.template);
+    const styles = el.styles && window.atob(el.styles);
+    const exportedClassName = script && ((_a = EXPORTED_CLASS_REGEX.exec(script)) !== null && _a !== void 0 ? _a : [])[1];
+    if (!exportedClassName) {
+        throw new Error("Script doesn't have exported class");
+    }
+    const elementMetadata = extractElementMetadata(script || '');
+    const path = (parentPath ? parentPath + '/' : '') + elementMetadata.name;
+    return Object.assign(Object.assign({}, elementMetadata), { path, script: script === null || script === void 0 ? void 0 : script.replace(METADATA_DECORATOR_REGEX, 'export class'), template,
+        styles, children: el.children.map(child => elementToMetadata(child, path)) });
+};
+const metadataToElement = (metadata, recursive = true) => {
+    const elMetadata = {
+        name: metadata.name,
+        isShared: metadata.isShared,
+        type: metadata.type,
+        model: metadata.model,
+        module: metadata.module,
+        reference: metadata.reference,
+        inputs: metadata.inputs,
+        outputs: metadata.outputs,
+        children: metadata.children.map(({ name }) => name),
+    };
+    const normalizedElMetadata = normalizeElementMetadata(elMetadata);
+    if (!metadata.script || !EXPORTED_CLASS_REGEX.test(metadata.script)) {
+        throw new UiBuildError(`'${metadata.name}' component script is missing an exported class`, metadata);
+    }
+    const script = metadata.script &&
+        window.btoa(metadata.script.replace(EXPORTED_CLASS_REGEX, `@ElementDefinition(${stringifyElementMetadata(normalizedElMetadata)})\nexport class Script`));
+    const template = metadata.template && window.btoa(metadata.template);
+    const styles = metadata.styles && window.btoa(metadata.styles);
+    return {
+        script,
+        template,
+        styles,
+        children: recursive ? metadata.children.map(meta => metadataToElement(meta)) : [],
+    };
+};
+const normalizeElementMetadata = (elementMetadata) => {
+    var _a, _b, _c, _d;
+    const metadata = Object.assign({}, elementMetadata);
+    // model
+    const { lineItem, path } = (_a = metadata.model) !== null && _a !== void 0 ? _a : {};
+    const model = lineItem ? { lineItem } : path ? { path } : undefined;
+    if (model) {
+        metadata.model = model;
+    }
+    else {
+        delete metadata.model;
+    }
+    // module
+    if (!metadata.module) {
+        delete metadata.module;
+    }
+    // reference
+    if (!metadata.reference) {
+        delete metadata.reference;
+    }
+    // inputs
+    const inputs = Object.entries((_b = metadata.inputs) !== null && _b !== void 0 ? _b : {}).reduce((acc, [key, value]) => {
+        return Object.assign(Object.assign({}, acc), { [key]: value || null });
+    }, {});
+    if (inputs && Object.keys(inputs).length > 0) {
+        metadata.inputs = inputs;
+    }
+    else {
+        delete metadata.inputs;
+    }
+    // outputs
+    const outputs = Object.entries((_c = metadata.outputs) !== null && _c !== void 0 ? _c : {}).reduce((acc, [key, value]) => {
+        return Object.assign(Object.assign({}, acc), { [key]: value || null });
+    }, {});
+    if (outputs && Object.keys(outputs).length > 0) {
+        metadata.outputs = outputs;
+    }
+    else {
+        delete metadata.outputs;
+    }
+    // children
+    if (!((_d = metadata.children) === null || _d === void 0 ? void 0 : _d.length)) {
+        delete metadata.children;
+    }
+    // isShared
+    if (!metadata.isShared) {
+        delete metadata.isShared;
+    }
+    return metadata;
+};
+const extractElementMetadata = (script) => {
+    var _a;
+    const metadataString = ((_a = METADATA_DECORATOR_REGEX.exec(script)) !== null && _a !== void 0 ? _a : [])[1];
+    // need to reset regex last index to prevent null result for next execution
+    METADATA_DECORATOR_REGEX.lastIndex = 0;
+    return new Function(`return ${metadataString}`)();
+};
+const extendElementMetadata = (script, extend) => {
+    var _a;
+    const metadataString = ((_a = METADATA_DECORATOR_REGEX.exec(script)) !== null && _a !== void 0 ? _a : [])[1];
+    // need to reset regex last index to prevent null result for next execution
+    METADATA_DECORATOR_REGEX.lastIndex = 0;
+    if (!metadataString) {
+        return script;
+    }
+    const updated = Object.assign(Object.assign({}, new Function(`return ${metadataString}`)()), extend);
+    return script.replace(metadataString, stringifyElementMetadata(updated));
+};
+const getElementConfig = (type) => {
+    return CONFIG[type];
+};
+const doesElementSupportIO = (type) => {
+    var _a, _b;
+    return (_b = (_a = getElementConfig(type).plugins) === null || _a === void 0 ? void 0 : _a.includes(IOPlugin)) !== null && _b !== void 0 ? _b : false;
+};
+function stringifyElementMetadata(elementMetadata) {
+    const cleaned = JSON.stringify(elementMetadata, null, 2);
+    return cleaned.replace(/^[\t ]*"[^:\n\r]+(?<!\\)":/gm, function (match) {
+        return match.replace(/"/g, '');
+    });
+}
+const isValidScript = (script) => {
+    var _a;
+    if (!script) {
+        return false;
+    }
+    const exportedClassName = script && ((_a = EXPORTED_CLASS_REGEX.exec(script)) !== null && _a !== void 0 ? _a : [])[1];
+    if (!exportedClassName) {
+        return false;
+    }
+    const meta = extractElementMetadata(script);
+    if (!meta.name || !meta.type) {
+        return false;
+    }
+    return true;
+};
+
+class ElementContextService {
+}
+ElementContextService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ElementContextService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementContextService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementContextService, decorators: [{
+            type: Injectable
+        }] });
+
+class ElementRendererComponent {
+    constructor(parentInjector, dynamicModuleService, elementContext, ioProviderService, configurationService, elementRef, cdr) {
+        this.parentInjector = parentInjector;
+        this.dynamicModuleService = dynamicModuleService;
+        this.elementContext = elementContext;
+        this.ioProviderService = ioProviderService;
+        this.configurationService = configurationService;
+        this.elementRef = elementRef;
+        this.cdr = cdr;
+        this.refs = {};
+        this.destroy$ = new Subject();
+    }
+    ngOnInit() {
+        this.elementContext.metadata = this.meta;
+        this.factory = this.dynamicModuleService.getComponentFactory(this.meta);
+        this.createComponents();
+    }
+    ngOnDestroy() {
+        this.destroyComponents();
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    createComponents() {
+        const modelMeta = this.meta.model;
+        if (!modelMeta) {
+            this.refs[UUID.UUID()] = this.createComponent();
+            return;
+        }
+        if (modelMeta.lineItem) {
+            this.createFromLineItem(modelMeta.lineItem);
+        }
+        else if (modelMeta.path) {
+            this.createFromPath(modelMeta.path);
+        }
+    }
+    createFromPath(path) {
+        const array$ = this.ioProviderService.connect(this.meta, 'children$', path);
+        array$ === null || array$ === void 0 ? void 0 : array$.pipe(takeUntil(this.destroy$)).subscribe(children => {
+            if (!isArray(children)) {
+                return;
+            }
+            this.processChildren(children);
+        });
+    }
+    createFromLineItem(path) {
+        var _a, _b;
+        const parentComp = this.parentInjector.get(ElementRendererComponent, null);
+        const parentPath = (_a = parentComp === null || parentComp === void 0 ? void 0 : parentComp.meta.model) === null || _a === void 0 ? void 0 : _a.lineItem;
+        const pathBlocks = parseBoundPath(path).reverse();
+        const { property, name } = (_b = pathBlocks[1]) !== null && _b !== void 0 ? _b : {};
+        const finalPath = pathBlocks[0];
+        const children$ = this.getParentLineItem$(parentComp).pipe(map(model => {
+            var _a;
+            if (property === 'ports' && !finalPath.property && parentPath !== path) {
+                return (_a = model.lineItems.filter(({ port }) => port === name)) !== null && _a !== void 0 ? _a : [];
+            }
+            return [model];
+        }));
+        children$.pipe(takeUntil(this.destroy$)).subscribe(children => {
+            this.processChildren(children);
+        });
+    }
+    processChildren(children) {
+        const refs = children.reduce((acc, data) => {
+            var _a;
+            const key = String((_a = data === null || data === void 0 ? void 0 : data.id) !== null && _a !== void 0 ? _a : UUID.UUID());
+            const ref = this.refs[key] ? this.updateComponent(key, data) : this.createComponent(data);
+            return ref ? Object.assign(Object.assign({}, acc), { [key]: ref }) : acc;
+        }, {});
+        const existingKeys = Object.keys(this.refs);
+        const newKeys = Object.keys(refs);
+        pull(existingKeys, ...newKeys).forEach(key => {
+            this.destroyComponent(key);
+        });
+        this.refs = refs;
+        this.cdr.detectChanges();
+    }
+    getParentLineItem$(parentComp) {
+        var _a;
+        const parentRefs = Object.values((_a = parentComp === null || parentComp === void 0 ? void 0 : parentComp.refs) !== null && _a !== void 0 ? _a : {});
+        const parentRef = parentRefs.find(ref => { var _a; return (_a = ref === null || ref === void 0 ? void 0 : ref.location.nativeElement) === null || _a === void 0 ? void 0 : _a.contains(this.elementRef.nativeElement); });
+        const parentModel$ = parentRef === null || parentRef === void 0 ? void 0 : parentRef.instance.model$;
+        return parentModel$ !== null && parentModel$ !== void 0 ? parentModel$ : this.configurationService.get();
+    }
+    createComponent(data) {
+        var _a, _b;
+        if (!this.factory) {
+            return;
+        }
+        const componentRef = (_a = this.el) === null || _a === void 0 ? void 0 : _a.createComponent(this.factory);
+        if (componentRef) {
+            componentRef.location.nativeElement.setAttribute('name', this.meta.name);
+            componentRef.location.nativeElement.setAttribute('path', this.meta.path);
+            (_b = componentRef.instance) === null || _b === void 0 ? void 0 : _b.model$.next(data);
+        }
+        return componentRef;
+    }
+    updateComponent(key, data) {
+        const ref = this.refs[key];
+        ref === null || ref === void 0 ? void 0 : ref.instance.model$.next(data);
+        return ref;
+    }
+    destroyComponent(key) {
+        var _a;
+        (_a = this.refs[key]) === null || _a === void 0 ? void 0 : _a.destroy();
+        delete this.refs[key];
+    }
+    destroyComponents() {
+        Object.values(this.refs).forEach(ref => ref === null || ref === void 0 ? void 0 : ref.destroy());
+        this.refs = {};
+    }
+}
+ElementRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementRendererComponent, deps: [{ token: i0.Injector, skipSelf: true }, { token: DynamicModuleService }, { token: ElementContextService }, { token: IOProviderService }, { token: i2.ConfigurationService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+ElementRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ElementRendererComponent, selector: "vl-cms-element-renderer", inputs: { meta: "meta" }, providers: [ElementContextService], viewQueries: [{ propertyName: "el", first: true, predicate: ["el"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<ng-template #el></ng-template>\n", styles: [":host{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementRendererComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'vl-cms-element-renderer',
+                    templateUrl: './element-renderer.component.html',
+                    styleUrls: ['./element-renderer.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [ElementContextService],
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Injector, decorators: [{
+                    type: SkipSelf
+                }] }, { type: DynamicModuleService }, { type: ElementContextService }, { type: IOProviderService }, { type: i2.ConfigurationService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { el: [{
+                type: ViewChild,
+                args: ['el', { read: ViewContainerRef, static: true }]
+            }], meta: [{
+                type: Input
+            }] } });
+
+class ElementChildrenComponent {
+    constructor(elementContext) {
+        this.elementContext = elementContext;
+        this.metadata = this.elementContext.metadata;
+    }
+}
+ElementChildrenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementChildrenComponent, deps: [{ token: ElementContextService }], target: i0.ɵɵFactoryTarget.Component });
+ElementChildrenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ElementChildrenComponent, selector: "element-children", ngImport: i0, template: "<ng-container *ngIf=\"metadata?.children.length\">\n  <ng-container *ngFor=\"let child of metadata.children\">\n    <vl-cms-element-renderer [meta]=\"child\"></vl-cms-element-renderer>\n  </ng-container>\n</ng-container>\n", styles: [":host{display:contents}\n"], components: [{ type: ElementRendererComponent, selector: "vl-cms-element-renderer", inputs: ["meta"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementChildrenComponent, decorators: [{
+            type: Component,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/component-selector
+                    selector: 'element-children',
+                    templateUrl: 'element-children.component.html',
+                    styleUrls: ['./element-children.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: ElementContextService }]; } });
+
+// eslint-disable-next-line @angular-eslint/directive-selector
+class CustomTemplateDirective {
+    constructor(templateRef, templatesService) {
+        this.templateRef = templateRef;
+        this.templatesService = templatesService;
+    }
+    ngAfterViewInit() {
+        if (!this.customTemplate) {
+            return;
+        }
+        this.templatesService.register(this.customTemplate, this.templateRef);
+    }
+}
+CustomTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CustomTemplateDirective, deps: [{ token: i0.TemplateRef }, { token: TemplatesService }], target: i0.ɵɵFactoryTarget.Directive });
+CustomTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: CustomTemplateDirective, selector: "[customTemplate]", inputs: { customTemplate: "customTemplate" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CustomTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[customTemplate]' }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: TemplatesService }]; }, propDecorators: { customTemplate: [{
+                type: Input
+            }] } });
+
+const defaultOptions = {
+    suppressLoading: false,
+    loadingLabel: 'LOADING',
+};
+
+const moduleMap = {};
+function loadRemoteEntry(remoteEntry) {
+    return new Promise((resolve, reject) => {
+        if (moduleMap[remoteEntry]) {
+            resolve();
+            return;
+        }
+        const script = document.createElement('script');
+        script.src = remoteEntry;
+        script.onerror = reject;
+        script.onload = () => {
+            moduleMap[remoteEntry] = true;
+            resolve(); // window is the global namespace
+        };
+        document.body.append(script);
+    });
+}
+function lookupExposedModule(remoteName, exposedModule) {
+    return __awaiter(this, void 0, void 0, function* () {
+        // Initializes the share scope. This fills it with known provided modules from this build and all remotes
+        yield __webpack_init_sharing__('default');
+        const container = window[remoteName]; // or get the container somewhere else
+        // Initialize the container, it may provide shared modules
+        yield container.init(__webpack_share_scopes__.default);
+        const factory = yield container.get(exposedModule);
+        const Module = factory();
+        return Module;
+    });
+}
+function loadRemoteModule(remoteEntry, remoteName, exposedModule) {
+    return __awaiter(this, void 0, void 0, function* () {
+        yield loadRemoteEntry(remoteEntry);
+        return yield lookupExposedModule(remoteName, exposedModule);
+    });
+}
+
+class FederatedComponent {
+    constructor(injector, compiler, appRef, renderer) {
+        this.injector = injector;
+        this.compiler = compiler;
+        this.appRef = appRef;
+        this.renderer = renderer;
+        this.isLoading$ = new BehaviorSubject(false);
+        // configs
+        this.suppressLoading = defaultOptions.suppressLoading;
+        this.loadingLabel = defaultOptions.loadingLabel;
+    }
+    ngOnChanges(changes) {
+        var _a, _b, _c, _d;
+        if (changes.data && this.instance) {
+            this.instance.data = this.data;
+        }
+        if (changes.options) {
+            this.suppressLoading = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.suppressLoading) !== null && _b !== void 0 ? _b : defaultOptions.suppressLoading;
+            this.loadingLabel = (_d = (_c = this.options) === null || _c === void 0 ? void 0 : _c.loadingLabel) !== null && _d !== void 0 ? _d : defaultOptions.loadingLabel;
+        }
+    }
+    ngOnInit() {
+        this.isLoading$.next(true);
+    }
+    ngAfterViewInit() {
+        var _a, _b, _c, _d, _e, _f;
+        const remoteEntry = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.remoteEntry) !== null && _b !== void 0 ? _b : this.remoteEntry;
+        const remoteName = (_d = (_c = this.options) === null || _c === void 0 ? void 0 : _c.remoteName) !== null && _d !== void 0 ? _d : this.remoteName;
+        const exposedModule = (_f = (_e = this.options) === null || _e === void 0 ? void 0 : _e.exposedModule) !== null && _f !== void 0 ? _f : this.exposedModule;
+        if (!remoteEntry || !remoteName || !exposedModule) {
+            return;
+        }
+        loadRemoteModule(remoteEntry, remoteName, exposedModule).then(federated => {
+            this.compiler.compileModuleAsync(federated[exposedModule]).then(moduleFactory => {
+                var _a, _b, _c;
+                const rootModuleRef = moduleFactory.create(this.injector);
+                const rootComponentFactory = rootModuleRef.componentFactoryResolver.resolveComponentFactory(federated[exposedModule].rootComponent);
+                const node = document.createElement('div');
+                const { instance, hostView } = rootComponentFactory.create(this.injector, [], node);
+                this.instance = instance;
+                this.instance.data = this.data;
+                this.renderer.appendChild((_a = this.moduleHostRef) === null || _a === void 0 ? void 0 : _a.nativeElement, node);
+                this.appRef.attachView(hostView);
+                (_c = (_b = this.options) === null || _b === void 0 ? void 0 : _b.onReady) === null || _c === void 0 ? void 0 : _c.call(_b);
+                this.isLoading$.next(false);
+            });
+        });
+    }
+}
+FederatedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FederatedComponent, deps: [{ token: i0.Injector }, { token: i0.Compiler }, { token: i0.ApplicationRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+FederatedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FederatedComponent, selector: "veloce-host-federated", inputs: { remoteEntry: "remoteEntry", remoteName: "remoteName", exposedModule: "exposedModule", data: "data", options: "options" }, viewQueries: [{ propertyName: "moduleHostRef", first: true, predicate: ["moduleHost"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #moduleHost></div>\n\n<vl-loader *ngIf=\"!suppressLoading && (isLoading$ | async)\" [label]=\"loadingLabel\"></vl-loader>\n", styles: [":host{display:block}div{height:100%}\n"], components: [{ type: i1.LoaderComponent, selector: "vl-loader", inputs: ["label", "overlayVisible"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i7.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FederatedComponent, decorators: [{
+            type: Component,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/component-selector
+                    selector: 'veloce-host-federated',
+                    templateUrl: './federated.component.html',
+                    styleUrls: ['./federated.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.Compiler }, { type: i0.ApplicationRef }, { type: i0.Renderer2 }]; }, propDecorators: { moduleHostRef: [{
+                type: ViewChild,
+                args: ['moduleHost', { static: false }]
+            }], remoteEntry: [{
+                type: Input
+            }], remoteName: [{
+                type: Input
+            }], exposedModule: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], options: [{
+                type: Input
+            }] } });
+
+class FederatedModule {
+}
+FederatedModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FederatedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+FederatedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FederatedModule, declarations: [FederatedComponent], imports: [CommonModule, LoaderModule], exports: [FederatedComponent] });
+FederatedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FederatedModule, imports: [[CommonModule, LoaderModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FederatedModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [FederatedComponent],
+                    imports: [CommonModule, LoaderModule],
+                    exports: [FederatedComponent],
+                }]
+        }] });
+
+class ConfigurationPlugin {
+    constructor(host) {
+        var _a, _b;
+        this.host = host;
+        this.destroy$ = new Subject();
+        this.elementMetadata = this.host.injector.get(ELEMENT_METADATA);
+        this.configurationService = this.host.injector.get(ConfigurationService);
+        if ((_a = this.elementMetadata.model) === null || _a === void 0 ? void 0 : _a.lineItem) {
+            this.host.model$.pipe(takeUntil(this.destroy$)).subscribe(model => (this.modelSnapshot = model));
+            const pathBlocks = parseBoundPath((_b = this.elementMetadata.model) === null || _b === void 0 ? void 0 : _b.lineItem);
+            const { type, property, name } = pathBlocks.reverse()[0];
+            this.host.boundName = name !== null && name !== void 0 ? name : type;
+            this.register(type, property, name);
+        }
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    register(type, property, name) {
+        if (!type) {
+            return;
+        }
+        if (!property) {
+            this.registerType();
+        }
+        else if (property === 'ports' && name) {
+            this.registerPort(name);
+        }
+        else if (property === 'attributes' && name) {
+            this.registerAttribute(name);
+        }
+    }
+    registerType() {
+        const remove = (id) => {
+            const rootLineItem = this.configurationService.getSnapshot();
+            if (!rootLineItem) {
+                return;
+            }
+            this.configurationService.patch(new LineItemWorker(rootLineItem).remove(id).li);
+        };
+        this.typeHost.remove = remove;
+    }
+    registerPort(name) {
+        const model$ = this.host.model$;
+        const portItems$ = model$.pipe(map(model => { var _a; return (_a = model === null || model === void 0 ? void 0 : model.lineItems.filter(li => li.port === this.host.boundName)) !== null && _a !== void 0 ? _a : []; }));
+        const portDomain$ = model$.pipe(map(model => model === null || model === void 0 ? void 0 : model.portDomains[this.host.boundName]));
+        const add = (type, attributes = []) => {
+            if (!this.modelSnapshot) {
+                return;
+            }
+            const portDomain = this.modelSnapshot.portDomains[name];
+            if (!portDomain) {
+                return;
+            }
+            const generated = generateLineItem(portDomain.name, type, this.modelSnapshot.id, attributes);
+            this.configurationService.patch(new LineItemWorker(this.modelSnapshot).insert(this.modelSnapshot.id, generated).li);
+        };
+        this.portHost.portItems$ = portItems$;
+        this.portHost.portDomain$ = portDomain$;
+        this.portHost.addPortItem = add;
+    }
+    registerAttribute(name) {
+        if (!this.host.model$) {
+            return;
+        }
+        const value$ = this.host.model$.pipe(map(model => { var _a; return getAttributeValue((_a = model === null || model === void 0 ? void 0 : model.attributes) !== null && _a !== void 0 ? _a : [], name); }));
+        const patch = (value) => {
+            if (!this.modelSnapshot) {
+                return;
+            }
+            this.configurationService.patch(new LineItemWorker(this.modelSnapshot).patchAttribute([{ name, value }]).li);
+        };
+        this.attributeHost.value$ = value$;
+        this.attributeHost.patch = patch;
+    }
+    get attributeHost() {
+        return this.host;
+    }
+    get typeHost() {
+        return this.host;
+    }
+    get portHost() {
+        return this.host;
+    }
+}
+ConfigurationPlugin.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ConfigurationPlugin, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+ConfigurationPlugin.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: ConfigurationPlugin, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ConfigurationPlugin, decorators: [{
+            type: Directive
+        }], ctorParameters: function () { return [{ type: undefined }]; } });
+
+const DEFAULT_PLUGINS = {
+    CONFIGURATION: [ConfigurationPlugin],
+    DEFAULT: [],
+};
+
+const InitAction = { type: 'INIT' };
+const ClearAction = { type: 'CLEAR' };
+class IntegrationState {
+    constructor() {
+        this.stateSubj$ = new BehaviorSubject({});
+        this.action$ = new BehaviorSubject(InitAction);
+    }
+    get state$() {
+        return this.stateSubj$.asObservable();
+    }
+    get state() {
+        return this.stateSubj$.getValue();
+    }
+    patchState(update) {
+        this.stateSubj$.next(Object.assign(Object.assign({}, this.stateSubj$.getValue()), update));
+    }
+    dispatch(action) {
+        this.action$.next(action);
+    }
+    listen$(actionType) {
+        return this.action$.pipe(filter(action => action.type === actionType), map(action => action.payload));
+    }
+    listenAll$() {
+        return this.action$.asObservable();
+    }
+    clear() {
+        this.stateSubj$.next({});
+        this.action$.next(ClearAction);
+    }
+}
+IntegrationState.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IntegrationState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+IntegrationState.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IntegrationState, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IntegrationState, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+const VELOCE_LIBS = {
+    '@veloceapps/sdk/core': Object.assign({ ConfigurationService,
+        QuoteDraftService,
+        FlowConfigurationService,
+        LineItemWorker,
+        ProductImagesService }, lineItemUtils),
+    '@veloceapps/sdk/cms': Object.assign(Object.assign(Object.assign({}, cmsInjectionTokens), cmsActions), { TemplatesService,
+        IntegrationState }),
+    '@veloceapps/api': {
+        SalesforceApiService,
+        QuoteApiService,
+        DocumentTemplatesApiService,
+        DocumentAttachmentApiService,
+        RampApiService,
+        CatalogApiService,
+        DeltaApiService,
+        PicklistsApiService,
+        PriceApiService,
+    },
+    '@angular/core': i0,
+    '@angular/forms': angularForms,
+    rxjs: rxjs,
+    'rxjs/operators': rxjsOperators,
+    lodash: lodash,
+};
+const VELOCE_LIBS_BACKWARDS_COMPATIBLE = Object.entries(VELOCE_LIBS).reduce((trunk, [key, value]) => (Object.assign(Object.assign({}, trunk), { [key.replace('@veloceapps/', '@veloce/')]: value })), {});
+const vendorMap = Object.assign(Object.assign(Object.assign({}, VELOCE_LIBS), VELOCE_LIBS_BACKWARDS_COMPATIBLE), { '@angular/core': i0, '@angular/forms': angularForms, rxjs: rxjs, 'rxjs/operators': rxjsOperators, lodash: lodash });
+
+class ElementsResolver {
+    constructor(uiDef, elements) {
+        this.uiDef = uiDef;
+        this.renderableElements = [];
+        this.sharedElements = [];
+        this.elements = this.transpileScripts(elements);
+        const flatElements = this.flattenElements(this.elements);
+        for (const el of flatElements) {
+            if (this.isSharedElement(el)) {
+                this.sharedElements.push(el);
+            }
+            else {
+                this.renderableElements.push(el);
+            }
+        }
+    }
+    transpile(el) {
+        var _a;
+        if (!el.script) {
+            return;
+        }
+        const transformed = transform(el.script, {
+            filename: el.name + '.ts',
+            presets: ['typescript'],
+            sourceMaps: 'inline',
+        });
+        return (_a = transformed.code) !== null && _a !== void 0 ? _a : undefined;
+    }
+    transpileScripts(elements) {
+        return elements.map(el => (Object.assign(Object.assign({}, el), { script: this.transpile(el), children: this.transpileScripts(el.children) })));
+    }
+    flattenElements(elements) {
+        return flatten(elements.map(el => [el, ...this.flattenElements(el.children)]));
+    }
+    isSharedElement(el) {
+        return Boolean(el.isShared) && el.type !== 'REFERENCE';
+    }
+    getSharedElement(element) {
+        if (element.type !== 'REFERENCE') {
+            return;
+        }
+        return this.sharedElements.find(el => element.reference === el.name);
+    }
+    resolveElementTemplate(element) {
+        const config = CONFIG[element.type];
+        const template = !config.suppressTemplate ? element.template : '';
+        return template || config.defaultTemplate || '';
+    }
+    resolveElementStyles(element) {
+        var _a;
+        const config = CONFIG[element.type];
+        return !config.suppressStyles ? (_a = element.styles) !== null && _a !== void 0 ? _a : '' : '';
+    }
+    processElementMetadata(sourceElement) {
+        var _a, _b;
+        const sharedElement = this.getSharedElement(sourceElement);
+        let finalElement;
+        if (sourceElement.type === 'REFERENCE') {
+            if (!sharedElement) {
+                console.warn(`Shared element "${sourceElement.reference}" not found`);
+                return;
+            }
+            finalElement = Object.assign(Object.assign({}, sourceElement), { type: sharedElement.type, template: sharedElement.template, styles: ((_a = sharedElement.styles) !== null && _a !== void 0 ? _a : '') + '\n' + ((_b = sourceElement.styles) !== null && _b !== void 0 ? _b : ''), inputs: Object.assign(Object.assign({}, sharedElement.inputs), sourceElement.inputs), outputs: Object.assign(Object.assign({}, sharedElement.outputs), sourceElement.outputs) });
+        }
+        else {
+            finalElement = sourceElement;
+        }
+        finalElement.template = this.resolveElementTemplate(finalElement);
+        finalElement.styles = this.resolveElementStyles(finalElement);
+        return finalElement;
+    }
+    resolveElement(sourceElement) {
+        var _a;
+        const element = this.processElementMetadata(sourceElement);
+        if (!element) {
+            return;
+        }
+        const config = CONFIG[element.type];
+        const defaultPlugins = (_a = DEFAULT_PLUGINS[this.uiDef.type]) !== null && _a !== void 0 ? _a : [];
+        if (!config) {
+            console.warn(`Unknown element type "${element.type}"`);
+            return;
+        }
+        const component = Object.assign(Object.assign({ selector: 'vl-element', template: element.template }, (element.styles ? { styles: [element.styles] } : {})), { providers: [
+                { provide: DEFAULT_PLUGINS_TOKEN, useValue: defaultPlugins },
+                { provide: UI_DEFINITION_METADATA, useValue: this.uiDef },
+                { provide: ELEMENT_METADATA, useValue: element },
+                { provide: SHARED_ELEMENT_METADATA, useValue: this.getSharedElement(sourceElement) },
+                { provide: ELEMENT_CONFIG, useValue: config },
+                { provide: VENDOR_MAP, useValue: vendorMap },
+            ] });
+        const cmp = Component(component)(class C extends config.component {
+        });
+        set(cmp, 'path', element.path);
+        return cmp;
+    }
+    getNgComponents() {
+        return this.renderableElements.map(el => this.resolveElement(el)).filter(Boolean);
+    }
+}
+
+class LauncherService {
+    constructor(compiler, dynamicModuleService) {
+        this.compiler = compiler;
+        this.dynamicModuleService = dynamicModuleService;
+    }
+    compileModule(elements, uiDefs) {
+        this.module = this.getModule(elements, uiDefs);
+        return from(this.compiler.compileModuleAndAllComponentsAsync(this.module)).pipe(tap(m => {
+            this.dynamicModuleService.componentFactories = m.componentFactories;
+            this.moduleInstance = m;
+        }));
+    }
+    destroy() {
+        if (this.moduleInstance) {
+            this.dynamicModuleService.clear();
+            this.moduleInstance = undefined;
+        }
+        if (this.module) {
+            this.compiler.clearCacheFor(this.module);
+            this.module = undefined;
+        }
+    }
+    getModule(elements, uiDef) {
+        const staticComponents = [ElementChildrenComponent, ElementRendererComponent, CustomTemplateDirective];
+        const elementsResolver = new ElementsResolver(uiDef, elements);
+        this.dynamicModuleService.elementsTree = elementsResolver.elements;
+        let DynamicModule = class DynamicModule {
+        };
+        DynamicModule = __decorate([
+            NgModule({
+                imports: [CommonModule, FormsModule, ReactiveFormsModule, FederatedModule, DragDropModule],
+                declarations: [...staticComponents, ...elementsResolver.getNgComponents()],
+                jit: true,
+            })
+        ], DynamicModule);
+        return DynamicModule;
+    }
+}
+LauncherService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherService, deps: [{ token: i0.Compiler }, { token: DynamicModuleService }], target: i0.ɵɵFactoryTarget.Injectable });
+LauncherService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i0.Compiler }, { type: DynamicModuleService }]; } });
+
+class PreviewComponent {
+    constructor(launcherService, configurationService, messageService, runtimeService, integrationState) {
+        this.launcherService = launcherService;
+        this.configurationService = configurationService;
+        this.messageService = messageService;
+        this.runtimeService = runtimeService;
+        this.integrationState = integrationState;
+        this.clearState = false;
+        this.state$ = new BehaviorSubject({ loading: true, failure: false });
+        this.elements = [];
+        this.destroy$ = new Subject();
+    }
+    ngOnInit() {
+        if (this.clearState) {
+            this.integrationState.clear();
+        }
+        this.startPreview();
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+        this.configurationService.reset();
+    }
+    initializeConfiguration$() {
+        const isAlreadyInitialized = this.runtimeService.isInitialized;
+        if (!this.uiDefinition || this.uiDefinition.type !== 'CONFIGURATION' || isAlreadyInitialized) {
+            return of({});
+        }
+        if (!this.modelId) {
+            console.warn(`No modelId is given for uiDefinition with '${this.uiDefinition.type}' type`);
+            return of({});
+        }
+        // If still not initialized - init configuration in Test mode
+        return this.runtimeService
+            .initTestMode(this.modelId, this.uiDefinition)
+            .pipe(switchMap(() => this.configurationService.configure()));
+    }
+    elementToMetadataSafe(elements) {
+        var _a, _b;
+        try {
+            return elements.map(element => elementToMetadata(element));
+        }
+        catch (e) {
+            console.error(e);
+            if (!((_b = (_a = this.uiDefinition) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.suppressToastMessages)) {
+                this.messageService.add({ severity: 'error', summary: String(e) });
+            }
+            return [];
+        }
+    }
+    startPreview() {
+        if (!this.uiDefinition) {
+            return;
+        }
+        const _a = this.uiDefinition, { children } = _a, uiDefinitionMeta = __rest(_a, ["children"]);
+        this.elements = this.elementToMetadataSafe(children);
+        const compilation$ = this.launcherService.compileModule(this.elements, uiDefinitionMeta);
+        forkJoin([compilation$, this.initializeConfiguration$()])
+            .pipe(tap(() => this.state$.next({ loading: false, failure: false })), catchError(error => {
+            var _a, _b;
+            console.error(error);
+            if (!((_b = (_a = this.uiDefinition) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.suppressToastMessages)) {
+                this.messageService.add({ severity: 'error', summary: error });
+            }
+            this.state$.next({ loading: false, failure: true });
+            return of();
+        }), takeUntil(this.destroy$))
+            .subscribe();
+    }
+}
+PreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PreviewComponent, deps: [{ token: LauncherService }, { token: i2.ConfigurationService }, { token: i3.MessageService }, { token: i2.ConfigurationRuntimeService }, { token: IntegrationState }], target: i0.ɵɵFactoryTarget.Component });
+PreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PreviewComponent, selector: "vl-cms-preview", inputs: { modelId: "modelId", uiDefinition: "uiDefinition", clearState: "clearState" }, providers: [IOProviderService, TemplatesService], ngImport: i0, template: "<ng-container *ngIf=\"state$ | async as state\">\n  <vl-loader *ngIf=\"state.loading; else content\" [label]=\"'Loading UI'\"></vl-loader>\n\n  <ng-template #content>\n    <ng-container *ngIf=\"!state.failure\">\n      <vl-cms-element-renderer *ngFor=\"let el of elements\" [meta]=\"el\"></vl-cms-element-renderer>\n    </ng-container>\n  </ng-template>\n</ng-container>\n", styles: [":host{flex-grow:1;display:flex;flex-direction:column;height:100%}\n"], components: [{ type: i1.LoaderComponent, selector: "vl-loader", inputs: ["label", "overlayVisible"] }, { type: ElementRendererComponent, selector: "vl-cms-element-renderer", inputs: ["meta"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i7.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.ShadowDom });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PreviewComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'vl-cms-preview',
+                    templateUrl: './preview.component.html',
+                    styleUrls: ['./preview.component.scss'],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [IOProviderService, TemplatesService],
+                    // use shadow DOM to prevent UI from being affected by global styles
+                    encapsulation: ViewEncapsulation.ShadowDom,
+                }]
+        }], ctorParameters: function () { return [{ type: LauncherService }, { type: i2.ConfigurationService }, { type: i3.MessageService }, { type: i2.ConfigurationRuntimeService }, { type: IntegrationState }]; }, propDecorators: { modelId: [{
+                type: Input
+            }], uiDefinition: [{
+                type: Input
+            }], clearState: [{
+                type: Input
+            }] } });
+
+class ElementRendererModule {
+}
+ElementRendererModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementRendererModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElementRendererModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementRendererModule, declarations: [ElementRendererComponent], exports: [ElementRendererComponent] });
+ElementRendererModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementRendererModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementRendererModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ElementRendererComponent],
+                    exports: [ElementRendererComponent],
+                }]
+        }] });
+
+class ElementChildrenModule {
+}
+ElementChildrenModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementChildrenModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElementChildrenModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementChildrenModule, declarations: [ElementChildrenComponent], imports: [ElementRendererModule], exports: [ElementChildrenComponent] });
+ElementChildrenModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementChildrenModule, imports: [[ElementRendererModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementChildrenModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ElementChildrenComponent],
+                    imports: [ElementRendererModule],
+                    exports: [ElementChildrenComponent],
+                }]
+        }] });
+
+class PreviewModule {
+}
+PreviewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PreviewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PreviewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PreviewModule, declarations: [PreviewComponent], imports: [CommonModule, LoaderModule, ElementRendererModule, ElementChildrenModule], exports: [PreviewComponent] });
+PreviewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PreviewModule, providers: [IntegrationState], imports: [[CommonModule, LoaderModule, ElementRendererModule, ElementChildrenModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PreviewModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [PreviewComponent],
+                    imports: [CommonModule, LoaderModule, ElementRendererModule, ElementChildrenModule],
+                    providers: [IntegrationState],
+                    exports: [PreviewComponent],
+                }]
+        }] });
+
+function ElementDefinition(definition) {
+    return function (constructor) {
+        return constructor;
+    };
+}
+
+class LauncherModule {
+}
+LauncherModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+LauncherModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherModule, imports: [CommonModule, CoreModule, ApiModule, SdkCoreModule] });
+LauncherModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherModule, providers: [LauncherService, IntegrationState, DynamicModuleService, DialogService], imports: [[CommonModule, CoreModule, ApiModule, SdkCoreModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: LauncherModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, CoreModule, ApiModule, SdkCoreModule],
+                    providers: [LauncherService, IntegrationState, DynamicModuleService, DialogService],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ApplyProductConfigurationAction, CloseDocGenAction, ConfigureProductAction, DEFAULT_PLUGINS_TOKEN, ELEMENT_CONFIG, ELEMENT_METADATA, ElementComponent, ElementDefinition, ElementsResolver, FlowAction, IntegrationState, LauncherModule, LauncherService, NavigateBackAction, NavigateToCatalogAction, OpenDocGenAction, PreviewComponent, PreviewModule, RemoteApplyAction, RemoteCancelAction, SHARED_ELEMENT_METADATA, TemplatesService, UI_DEFINITION_METADATA, UiBuildError, VENDOR_MAP, doesElementSupportIO, elementToMetadata, extendElementMetadata, extractElementMetadata, findElementByModule, getAbsolutePath, getElementConfig, isValidScript, metadataToElement, normalizeElementMetadata, parseBoundPath, parsePath, stringifyElementMetadata };
+//# sourceMappingURL=veloceapps-sdk-cms.js.map