@acorex/platform 1.0.0 → 1.0.2

package/fesm2022/acorex-platform-layout.mjs

@@ -0,0 +1,756 @@
+import * as i0 from '@angular/core';
+import { signal, Injectable, InjectionToken, inject, ChangeDetectorRef, computed, EventEmitter, Component, ChangeDetectionStrategy, Output, Input, Injector, ViewChild, NgModule, Optional, Inject, runInInjectionContext, Directive } from '@angular/core';
+import { set, clone, get, merge, cloneDeep, sum } from 'lodash-es';
+import { Subject, debounceTime, filter } from 'rxjs';
+import { AXUnsubscriber } from '@acorex/core/utils';
+import * as i2 from '@angular/cdk/portal';
+import { ComponentPortal, PortalModule } from '@angular/cdk/portal';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i3 from '@acorex/components/skeleton';
+import { AXSkeletonModule } from '@acorex/components/skeleton';
+import { AXDataTableColumnComponent } from '@acorex/components/data-table';
+
+class AXPLayoutContextService {
+    constructor() {
+        this.context$ = signal({});
+        this.onChanged = new Subject();
+        this.debouncers = {};
+        this.debouncerSubscriptions = {};
+    }
+    get context() {
+        return this.context$();
+    }
+    initial(value) {
+        this.context$.set(value);
+    }
+    // setValue(path: string, value: any) {
+    //   this.context$.update((ctx) => set(clone(ctx), path, value));
+    //   this.onChanged.next({
+    //     data: this.context,
+    //     path,
+    //   });
+    // }
+    setValue(path, value, debounceMs = 50) {
+        if (!this.debouncers[path]) {
+            // Create a new Subject for debouncing if it doesn't exist
+            this.debouncers[path] = new Subject();
+            // Subscribe to the subject with debounceTime
+            this.debouncerSubscriptions[path] = this.debouncers[path].pipe(debounceTime(debounceMs)).subscribe(({ value }) => {
+                // Only emit onChanged event after debounce time
+                this.onChanged.next({
+                    data: this.context,
+                    path,
+                });
+            });
+        }
+        // Update context immediately
+        this.context$.update((ctx) => set(clone(ctx), path, value));
+        // Emit value through the debouncer subject
+        this.debouncers[path].next({ path, value });
+    }
+    getValue(path) {
+        return get(this.context, path);
+    }
+    unsubscribeDebouncers() {
+        Object.keys(this.debouncerSubscriptions).forEach((path) => {
+            this.debouncerSubscriptions[path].unsubscribe();
+            delete this.debouncerSubscriptions[path]; // Clean up the reference
+            delete this.debouncers[path]; // Also clean up the debouncer subject
+        });
+    }
+    ngOnDestroy() {
+        console.log(this.debouncerSubscriptions);
+        this.unsubscribeDebouncers();
+        console.log(this.debouncerSubscriptions);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutContextService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutContextService, decorators: [{
+            type: Injectable
+        }] });
+
+const AXP_WIDGET_TOKEN = new InjectionToken('AXP_WIDGET_TOKEN');
+class AXPWidgetBase {
+    constructor() {
+        this.token = inject(AXP_WIDGET_TOKEN);
+        this.cdr = inject(ChangeDetectorRef);
+        this.id = this.token.id;
+        this.path = this.token.path;
+        this.mode = this.token.mode;
+        this.type = this.token.type;
+        this.children = this.token.children;
+        this.contextService = inject(AXPLayoutContextService);
+        this.value = computed(() => (this.path ? get(this.contextService.context, this.path) : null));
+    }
+    ngOnInit() {
+        this.setOptions(this.token.options);
+    }
+    getValue() {
+        return this.value();
+    }
+    setValue(value) {
+        if (this.path) {
+            this.contextService.setValue(this.path, value);
+        }
+    }
+    setOption(path, value) {
+        set(this, path, value);
+        this.cdr.markForCheck();
+    }
+    setOptions(values) {
+        merge(this, values);
+        this.cdr.markForCheck();
+    }
+    call(name, ...args) {
+        const fn = get(this, name);
+        if (fn && typeof fn == 'function') {
+            fn.bind(this)(...args);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetBase, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetBase }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetBase, decorators: [{
+            type: Injectable
+        }] });
+
+class AXPWidgetContainerComponent {
+    constructor() {
+        this.contextChange = new EventEmitter();
+        this.unsubscriber = inject(AXUnsubscriber);
+        this.contextService = inject(AXPLayoutContextService);
+    }
+    get context() {
+        return this._context;
+    }
+    set context(v) {
+        this._context = v;
+        this.contextChange.emit(v);
+    }
+    ngOnInit() {
+        this.contextService.initial(this.context);
+        this.contextService
+            .onChanged
+            .pipe(this.unsubscriber.takeUntilDestroy)
+            .subscribe(ctx => {
+            this.context = cloneDeep(ctx.data);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: { context: "context" }, outputs: { contextChange: "contextChange" }, host: { styleAttribute: "display: contents;" }, providers: [AXPLayoutContextService, AXUnsubscriber], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetContainerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'axp-widgets-container',
+                    template: `<ng-content></ng-content>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { style: 'display: contents;' },
+                    providers: [AXPLayoutContextService, AXUnsubscriber],
+                }]
+        }], propDecorators: { contextChange: [{
+                type: Output
+            }], context: [{
+                type: Input
+            }] } });
+
+class AXPWidgetRegistryService {
+    constructor() {
+        this.types = new Map();
+    }
+    register(widget) {
+        this.types.set(widget.name, widget);
+    }
+    extend(parentName, widget) {
+        const parentWidget = this.resolve(parentName);
+        const newWidget = merge({}, parentWidget, widget);
+        newWidget.name = widget.name;
+        this.register(newWidget);
+    }
+    resolve(name) {
+        const widget = this.types.get(name);
+        if (!widget) {
+            throw new Error(`Widget with name ${widget} does not exist.`);
+        }
+        return widget;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetRegistryService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetRegistryService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class AXPWidgetRendererComponent {
+    constructor() {
+        this.mergedOptions = signal({});
+        this.injector = inject(Injector);
+        this.contextService = inject(AXPLayoutContextService);
+        this.widgetRegistery = inject(AXPWidgetRegistryService);
+        this.unsubscriber = inject(AXUnsubscriber);
+        this.isLoading = signal(true);
+        this.expressionCache = new Map();
+        this.expressionEvaluators = new Map();
+        this.scope = null;
+        this.contextService.onChanged.pipe(this.unsubscriber.takeUntilDestroy).subscribe(async (e) => {
+            if (await this.updateOptionsBasedOnContext() > 0) {
+                this.applyOptions();
+            }
+            if (this.checkFormulaForUpdate(this.node.formula, e.path)) {
+                await this.updateValueBasedOnFormula();
+            }
+        });
+    }
+    async ngOnInit() {
+        if (!this.node?.type)
+            return;
+        await this.loadComponent();
+    }
+    async loadComponent() {
+        const widget = this.widgetRegistery.resolve(this.node.type);
+        this.mergedOptions.set(merge(cloneDeep(widget?.defaultOptions), cloneDeep(widget?.components[this.node.mode]?.defaultOptions)) || {});
+        this.preprocessAndInitialOptions(cloneDeep(this.node.options));
+        await this.updateOptionsBasedOnContext();
+        const tokenValue = {
+            id: this.node.id,
+            path: this.node.path,
+            mode: this.node.mode,
+            type: this.node.type,
+            children: this.node.children,
+            options: this.mergedOptions()
+        };
+        const token = Injector.create({
+            parent: this.injector,
+            providers: [
+                {
+                    provide: AXP_WIDGET_TOKEN,
+                    useValue: tokenValue,
+                },
+            ],
+        });
+        var com = await widget?.components[this.node.mode]?.component();
+        this.portal = new ComponentPortal(com, null, token);
+        this.isLoading.set(false);
+    }
+    async handleAttached(portalOutletRef) {
+        portalOutletRef = portalOutletRef;
+        this.instance = portalOutletRef.instance;
+        await this.updateValueBasedOnFormula();
+        await this.assignTriggers();
+    }
+    applyOptions() {
+        if (!this.instance)
+            return;
+        this.instance.setOptions(this.mergedOptions());
+    }
+    checkFormulaForUpdate(formula, path) {
+        if (formula) {
+            const regex = /context\.eval\('([^']+)'\)/g;
+            const matches = formula.match(regex);
+            const nodes = matches ? matches.map((match) => match.match(/'([^']+)'/)[1]) : [];
+            return nodes.includes(path);
+        }
+        else
+            return false;
+    }
+    preprocessAndInitialOptions(obj, pathPrefix = '') {
+        if (!obj)
+            return;
+        Object.entries(obj).forEach(([key, value]) => {
+            const currentPath = pathPrefix ? `${pathPrefix}.${key}` : key;
+            if (typeof value === 'string' && value.includes('{{')) {
+                // Cache dynamic expression for later evaluation
+                this.expressionEvaluators.set(currentPath, () => this.evaluateExpression(value));
+            }
+            else if (typeof value === 'object' && value !== null && (value.constructor === Object || Array.isArray(value))) {
+                // Recursively handle nested objects
+                this.preprocessAndInitialOptions(value, currentPath);
+            }
+            else {
+                // Apply static values directly
+                this.mergedOptions.update((currentOptions) => {
+                    return set(currentOptions, currentPath, value);
+                });
+            }
+        });
+    }
+    async updateOptionsBasedOnContext() {
+        const updates = [];
+        for (let [path, evaluator] of this.expressionEvaluators) {
+            const newValue = await evaluator();
+            updates.push({ path, newValue });
+        }
+        // Apply updates to mergedOptions
+        if (updates.length > 0) {
+            this.mergedOptions.update(o => {
+                const updatedOptions = { ...o };
+                updates.forEach(({ path, newValue }) => {
+                    // Set the new value in the updatedOptions object by path
+                    set(updatedOptions, path, newValue); // Assuming 'set' can handle paths like 'property.subproperty'
+                });
+                return updatedOptions;
+            });
+        }
+        return updates.length;
+    }
+    async updateValueBasedOnFormula() {
+        if (this.node.formula) {
+            const value = await this.evaluateExpression(this.node.formula);
+            this.instance.setValue(value);
+        }
+    }
+    async evaluateExpression(templateExpression) {
+        try {
+            // Check cache first, but cache the function for evaluation, not the evaluated value
+            if (!this.expressionCache.has(templateExpression)) {
+                const expressionMatch = templateExpression.match(/\{\{\s*(.*?)\s*\}\}/);
+                if (!expressionMatch) {
+                    throw Error(`No valid expression found in "${templateExpression}"`);
+                }
+                const expression = expressionMatch[1];
+                // Cache the evaluation function instead of the result
+                const scope = this.getGlobalScope();
+                const evaluationFunction = async () => {
+                    const sandbox = new Function('scope', `with (scope) { return (async function() { return ${expression}; })(); }`);
+                    return await sandbox(scope);
+                };
+                this.expressionCache.set(templateExpression, evaluationFunction);
+            }
+            // Retrieve the function from the cache and call it to evaluate the expression
+            const evaluate = this.expressionCache.get(templateExpression);
+            if (evaluate) {
+                // Ensure 'evaluate' is not undefined before invoking
+                return await evaluate();
+            }
+            else {
+                throw Error(`Failed to retrieve evaluation function for expression: "${templateExpression}"`);
+            }
+        }
+        catch (error) {
+            console.error('Error evaluating expression:', error);
+            return false;
+        }
+    }
+    getGlobalScope() {
+        if (this.scope)
+            return this.scope;
+        this.scope = {};
+        set(this.scope, 'context', this.getContextScope());
+        set(this.scope, 'events', this.getEventScope());
+        set(this.scope, 'widget', this.getWidgetScope());
+        set(this.scope, 'utils', this.getFunctionScope());
+        return this.scope;
+    }
+    getContextScope() {
+        const scope = {};
+        set(scope, 'eval', (path) => this.contextService.getValue(path));
+        return scope;
+    }
+    getEventScope() {
+        const scope = {};
+        set(scope, 'context', (path) => this.contextService.onChanged.pipe(filter((c) => c.path == path)));
+        return scope;
+    }
+    getWidgetScope() {
+        const scope = {};
+        set(scope, 'call', (name, ...args) => {
+            this.instance.call(name, ...args);
+        });
+        return scope;
+    }
+    getFunctionScope() {
+        const scope = {};
+        set(scope, 'sum', (values) => {
+            return sum(values);
+        });
+        return scope;
+    }
+    async assignTriggers() {
+        this.node.triggers?.forEach((t) => {
+            const event = this.evaluateTrigger(t.event);
+            event?.pipe(this.unsubscriber.takeUntilDestroy).subscribe((c) => {
+                this.evaluateAction(t.action);
+            });
+        });
+    }
+    evaluateTrigger(templateExpression) {
+        try {
+            const expressionMatch = templateExpression.match(/\{\{\s*(.*?)\s*\}\}/);
+            if (!expressionMatch) {
+                throw Error(`No valid expression found in "${templateExpression}"`);
+            }
+            const expression = expressionMatch[1];
+            // Cache the evaluation function instead of the result
+            const scope = this.getGlobalScope();
+            const sandbox = new Function('scope', `with (scope) { return (  function() { return ${expression}; })(); }`);
+            return sandbox(scope);
+        }
+        catch (error) {
+            console.error('Error evaluating expression:', error);
+            return null;
+        }
+    }
+    evaluateAction(templateExpression) {
+        try {
+            const expressionMatch = templateExpression.match(/\{\{\s*(.*?)\s*\}\}/);
+            if (!expressionMatch) {
+                throw Error(`No valid expression found in "${templateExpression}"`);
+            }
+            const expression = expressionMatch[1];
+            // Cache the evaluation function instead of the result
+            const scope = this.getGlobalScope();
+            const sandbox = new Function('scope', `with (scope) {  ${expression} }`);
+            sandbox(scope);
+        }
+        catch (error) {
+            console.error('Error evaluating expression:', error);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXPWidgetRendererComponent, selector: "axp-widget-renderer", inputs: { node: "node" }, providers: [
+            {
+                provide: AXUnsubscriber,
+            },
+        ], ngImport: i0, template: `
+    @if(mergedOptions().isVisible!=false) { @if(isLoading()){
+    <ax-skeleton [animated]="true" class="ax-w-full  lg:ax-w-[50%] ax-h-8 ax-rounded"></ax-skeleton>
+    } @else {
+    <ng-container *ngTemplateOutlet="tt"></ng-container>
+    } }
+    <ng-template #tt>
+      <ng-template [cdkPortalOutlet]="portal" (attached)="handleAttached($event)"></ng-template>
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i3.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetRendererComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'axp-widget-renderer',
+                    template: `
+    @if(mergedOptions().isVisible!=false) { @if(isLoading()){
+    <ax-skeleton [animated]="true" class="ax-w-full  lg:ax-w-[50%] ax-h-8 ax-rounded"></ax-skeleton>
+    } @else {
+    <ng-container *ngTemplateOutlet="tt"></ng-container>
+    } }
+    <ng-template #tt>
+      <ng-template [cdkPortalOutlet]="portal" (attached)="handleAttached($event)"></ng-template>
+    </ng-template>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [
+                        {
+                            provide: AXUnsubscriber,
+                        },
+                    ],
+                }]
+        }], ctorParameters: () => [], propDecorators: { node: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
+    constructor() {
+        super(...arguments);
+        this.mergedOptions = {};
+        this.injector = inject(Injector);
+        this.cdr = inject(ChangeDetectorRef);
+    }
+    get renderFooterTemplate() {
+        return this.footerTemplate ?? this._contentFooterTemplate;
+    }
+    get renderCellTemplate() {
+        return this.cellTemplate ?? this._contentCellTemplate;
+    }
+    get renderHeaderTemplate() {
+        return this.headerTemplate ?? this._contentHeaderTemplate;
+    }
+    get loadingEnabled() {
+        return true;
+    }
+    get name() {
+        return `col-${this.dataField}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetColumnRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: { width: "width", caption: "caption", headerTemplate: "headerTemplate", allowSorting: "allowSorting", fixed: "fixed", node: "node", footerTemplate: "footerTemplate", cellTemplate: "cellTemplate", options: "options", dataField: "dataField", displayFormat: "displayFormat" }, providers: [{ provide: AXDataTableColumnComponent, useExisting: AXPWidgetColumnRendererComponent }], viewQueries: [{ propertyName: "_contentFooterTemplate", first: true, predicate: ["footer"], descendants: true }, { propertyName: "_contentCellTemplate", first: true, predicate: ["cell"], descendants: true }, { propertyName: "_contentHeaderTemplate", first: true, predicate: ["header"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    <ng-template #header>{{ caption }}</ng-template>
+    <ng-template #cell let-row>
+      {{ node.path }}
+    </ng-template>
+    <ng-template #footer></ng-template>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPWidgetColumnRendererComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'axp-widget-column-renderer',
+                    template: `
+    <ng-template #header>{{ caption }}</ng-template>
+    <ng-template #cell let-row>
+      {{ node.path }}
+    </ng-template>
+    <ng-template #footer></ng-template>
+  `,
+                    providers: [{ provide: AXDataTableColumnComponent, useExisting: AXPWidgetColumnRendererComponent }],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    inputs: ['width', 'caption', 'headerTemplate', 'allowSorting', 'fixed'],
+                }]
+        }], propDecorators: { node: [{
+                type: Input,
+                args: [{ required: true }]
+            }], footerTemplate: [{
+                type: Input
+            }], _contentFooterTemplate: [{
+                type: ViewChild,
+                args: ['footer']
+            }], cellTemplate: [{
+                type: Input
+            }], _contentCellTemplate: [{
+                type: ViewChild,
+                args: ['cell']
+            }], headerTemplate: [{
+                type: Input
+            }], _contentHeaderTemplate: [{
+                type: ViewChild,
+                args: ['header']
+            }], options: [{
+                type: Input
+            }], dataField: [{
+                type: Input
+            }], displayFormat: [{
+                type: Input
+            }] } });
+
+class AXPLayoutBuilderModule {
+    static forRoot(config) {
+        return {
+            ngModule: AXPLayoutBuilderModule,
+            providers: [
+                {
+                    provide: 'AXPLayoutBuilderModuleFactory',
+                    useFactory: (registry) => () => {
+                        config?.widgets?.forEach(w => registry.register(w));
+                    },
+                    deps: [AXPWidgetRegistryService],
+                    multi: true
+                },
+            ]
+        };
+    }
+    static forChild(config) {
+        return {
+            ngModule: AXPLayoutBuilderModule,
+            providers: [
+                {
+                    provide: 'AXPLayoutBuilderModuleFactory',
+                    useFactory: (registry) => () => {
+                        config?.widgets?.forEach(w => registry.register(w));
+                    },
+                    deps: [AXPWidgetRegistryService],
+                    multi: true
+                }
+            ]
+        };
+    }
+    /**
+     * @ignore
+     */
+    constructor(instances) {
+        instances?.forEach(f => {
+            f();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutBuilderModule, deps: [{ token: 'AXPLayoutBuilderModuleFactory', optional: true }], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutBuilderModule, declarations: [AXPWidgetContainerComponent, AXPWidgetRendererComponent, AXPWidgetColumnRendererComponent], imports: [CommonModule, PortalModule, AXSkeletonModule, CommonModule], exports: [AXPWidgetContainerComponent, AXPWidgetRendererComponent, AXPWidgetColumnRendererComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutBuilderModule, imports: [CommonModule, PortalModule, AXSkeletonModule, CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPLayoutBuilderModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, PortalModule, AXSkeletonModule, CommonModule],
+                    exports: [AXPWidgetContainerComponent, AXPWidgetRendererComponent, AXPWidgetColumnRendererComponent],
+                    declarations: [AXPWidgetContainerComponent, AXPWidgetRendererComponent, AXPWidgetColumnRendererComponent],
+                }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: ['AXPLayoutBuilderModuleFactory']
+                }] }] });
+
+class AXPComponentSlotRegistryService {
+    constructor() {
+        this.registry = new Map();
+    }
+    register(slotName, config) {
+        let configs = this.registry.get(slotName) || [];
+        // Check if the component is already registered in this slot
+        const isDuplicate = configs.some(existingConfig => existingConfig.name === config.name);
+        if (!isDuplicate) {
+            configs = [...configs, config]; // Add the new configuration
+            this.registry.set(slotName, configs);
+        }
+    }
+    get(slotName) {
+        return this.registry.get(slotName) || [];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotRegistryService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotRegistryService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class AXPComponentSlotLoaderService {
+    constructor(registryService, injector) {
+        this.registryService = registryService;
+        this.injector = injector;
+    }
+    loadComponent(slotName, viewContainerRef) {
+        const configs = this.registryService.get(slotName);
+        if (configs) {
+            viewContainerRef.clear();
+            configs.forEach(async (config) => {
+                let component;
+                let options = {};
+                if (typeof config.loadComponent === 'function') {
+                    // If component is a function
+                    runInInjectionContext(this.injector, () => {
+                        component = config.loadComponent?.();
+                    });
+                }
+                else if (config.component) {
+                    // If component is a Type
+                    component = config.component;
+                }
+                //
+                if (typeof config.options === 'function') {
+                    // If options is a function
+                    runInInjectionContext(this.injector, () => {
+                        const fun = config.options;
+                        options = fun();
+                    });
+                }
+                else if (config.options) {
+                    // If options is a object
+                    options = config.options;
+                }
+                //
+                if (component != null) {
+                    const componentRef = viewContainerRef.createComponent(component);
+                    Object.assign(componentRef.instance, options);
+                }
+            });
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotLoaderService, deps: [{ token: AXPComponentSlotRegistryService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotLoaderService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotLoaderService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: AXPComponentSlotRegistryService }, { type: i0.Injector }] });
+
+class AXPComponentSlotDirective {
+    constructor(dynamicLoaderService, viewContainerRef) {
+        this.dynamicLoaderService = dynamicLoaderService;
+        this.viewContainerRef = viewContainerRef;
+    }
+    ngOnInit() {
+        this.dynamicLoaderService.loadComponent(this.name, this.viewContainerRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotDirective, deps: [{ token: AXPComponentSlotLoaderService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.2", type: AXPComponentSlotDirective, selector: "axp-component-slot", inputs: { name: "name" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'axp-component-slot',
+                }]
+        }], ctorParameters: () => [{ type: AXPComponentSlotLoaderService }, { type: i0.ViewContainerRef }], propDecorators: { name: [{
+                type: Input
+            }] } });
+
+class AXPComponentSlotModule {
+    static forRoot(configs) {
+        return {
+            ngModule: AXPComponentSlotModule,
+            providers: [
+                {
+                    provide: 'AXPComponentSlotModuleFactory',
+                    useFactory: (registry) => () => {
+                        if (configs) {
+                            for (const [key, value] of Object.entries(configs)) {
+                                value.forEach(v => {
+                                    registry.register(key, v);
+                                });
+                            }
+                        }
+                    },
+                    deps: [AXPComponentSlotRegistryService],
+                    multi: true
+                }
+            ]
+        };
+    }
+    static forChild(configs) {
+        return {
+            ngModule: AXPComponentSlotModule,
+            providers: [
+                {
+                    provide: 'AXPComponentSlotModuleFactory',
+                    useFactory: (registry) => () => {
+                        if (configs) {
+                            for (const [key, value] of Object.entries(configs)) {
+                                value.forEach(v => {
+                                    registry.register(key, v);
+                                });
+                            }
+                        }
+                    },
+                    deps: [AXPComponentSlotRegistryService],
+                    multi: true
+                }
+            ]
+        };
+    }
+    /**
+     * @ignore
+     */
+    constructor(instances) {
+        instances?.forEach(f => {
+            f();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotModule, deps: [{ token: 'AXPComponentSlotModuleFactory', optional: true }], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotModule, declarations: [AXPComponentSlotDirective], exports: [AXPComponentSlotDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXPComponentSlotModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AXPComponentSlotDirective],
+                    exports: [AXPComponentSlotDirective]
+                }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: ['AXPComponentSlotModuleFactory']
+                }] }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AXPComponentSlotDirective, AXPComponentSlotLoaderService, AXPComponentSlotModule, AXPComponentSlotRegistryService, AXPLayoutBuilderModule, AXPLayoutContextService, AXPWidgetBase, AXPWidgetColumnRendererComponent, AXPWidgetContainerComponent, AXPWidgetRegistryService, AXPWidgetRendererComponent, AXP_WIDGET_TOKEN };
+//# sourceMappingURL=acorex-platform-layout.mjs.map