@solcre-org/core-ui 2.11.13 → 2.11.14

package/fesm2022/solcre-org-core-ui.mjs

@@ -8949,6 +8949,105 @@ class SidebarCustomModalService {
     currentConfig = signal(null);
     componentRef = null;
     viewContainerRef = null;
+    componentRegistry = new Map();
+    async openComponent(componentPath, data, customClass, onClose) {
+        try {
+            if (componentPath.startsWith('./') || componentPath.startsWith('../')) {
+                const module = await this.loadComponentByPath(componentPath);
+                return this.createModalFromModule(module, data, customClass, onClose);
+            }
+            if (this.componentRegistry.has(componentPath)) {
+                return this.openRegisteredComponent(componentPath, data, customClass, onClose);
+            }
+            return this.loadComponentByConvention(componentPath, data, customClass, onClose);
+        }
+        catch (error) {
+            console.error('Error opening component:', componentPath, error);
+            throw new Error(`Failed to load component: ${componentPath}`);
+        }
+    }
+    async loadComponentByConvention(componentName, data, customClass, onClose) {
+        const conventions = [
+            `./components/${componentName}/${componentName}.component`,
+            `./components/${componentName}-modal/${componentName}-modal.component`,
+            `./modals/${componentName}/${componentName}.component`,
+            `./components/${componentName}.component`,
+        ];
+        for (const convention of conventions) {
+            try {
+                const module = await this.loadComponentByPath(convention);
+                return this.createModalFromModule(module, data, customClass, onClose);
+            }
+            catch (error) {
+                continue;
+            }
+        }
+        throw new Error(`Component '${componentName}' not found using any convention. Tried: ${conventions.join(', ')}`);
+    }
+    async loadComponentByPath(path) {
+        return import(/* @vite-ignore */ path);
+    }
+    createModalFromModule(module, data, customClass, onClose) {
+        const componentKey = Object.keys(module).find(key => key.endsWith('Component') &&
+            (key.includes('Modal') || key.includes('Dialog') || Object.keys(module).length === 1)) || Object.keys(module)[0];
+        if (!componentKey) {
+            throw new Error('No component found in module');
+        }
+        const Component = module[componentKey];
+        this.openComponentModal(Component, data, {
+            customClass,
+            onClose
+        });
+    }
+    openModal(componentPath, data, options) {
+        return this.openComponent(componentPath, data, options?.customClass, options?.onClose);
+    }
+    openLazyModal(lazyImport, data, options) {
+        return lazyImport()
+            .then(module => this.createModalFromModule(module, data, options?.customClass, options?.onClose))
+            .catch(error => {
+            console.error('Error loading lazy modal:', error);
+            throw new Error(`Failed to load lazy modal: ${error.message}`);
+        });
+    }
+    openDirectModal(component, data, options) {
+        this.openComponentModal(component, data, {
+            customClass: options?.customClass,
+            onClose: options?.onClose
+        });
+    }
+    registerComponent(name, loader) {
+        this.componentRegistry.set(name, loader);
+    }
+    openRegisteredComponent(componentName, data, customClass, onClose) {
+        const loader = this.componentRegistry.get(componentName);
+        if (!loader) {
+            throw new Error(`Component '${componentName}' not registered. Use registerComponent() first.`);
+        }
+        return loader()
+            .then((module) => {
+            const componentKey = Object.keys(module).find(key => key.endsWith('Component') || key === componentName);
+            if (!componentKey) {
+                throw new Error(`No component found in module for '${componentName}'`);
+            }
+            const Component = module[componentKey];
+            this.openComponentModal(Component, data, {
+                customClass,
+                onClose
+            });
+        })
+            .catch(error => {
+            console.error('Error loading registered component:', componentName, error);
+            throw new Error(`Failed to load component '${componentName}': ${error.message}`);
+        });
+    }
+    getRegisteredComponents() {
+        return Array.from(this.componentRegistry.keys());
+    }
+    registerAndOpenComponent(name, importPath, data, customClass, onClose) {
+        this.registerComponent(name, () => import(/* @vite-ignore */ importPath));
+        return this.openRegisteredComponent(name, data, customClass, onClose);
+    }
     getIsOpen() {
         return this.isOpen;
     }
@@ -8958,6 +9057,9 @@ class SidebarCustomModalService {
     setViewContainerRef(vcr) {
         this.viewContainerRef = vcr;
     }
+    resetViewContainerRef() {
+        this.viewContainerRef = null;
+    }
     openComponentModal(component, data, config) {
         this.closeModal();
         const modalConfig = {
@@ -8969,14 +9071,29 @@ class SidebarCustomModalService {
         };
         this.currentConfig.set(modalConfig);
         this.isOpen.set(true);
+        this.createComponentWhenReady(component, data);
+    }
+    createComponentWhenReady(component, data) {
+        if (this.viewContainerRef) {
+            this.createComponentInstance(component, data);
+        }
+        else {
+            setTimeout(() => this.createComponentWhenReady(component, data), 10);
+        }
+    }
+    createComponentInstance(component, data) {
+        if (this.componentRef) {
+            return;
+        }
         if (this.viewContainerRef && component) {
             this.componentRef = this.viewContainerRef.createComponent(component);
             if (data) {
                 Object.keys(data).forEach(key => {
-                    if (this.componentRef?.instance.hasOwnProperty(key)) {
+                    if (key in this.componentRef.instance) {
                         this.componentRef.instance[key] = data[key];
                     }
                 });
+                this.componentRef.changeDetectorRef.detectChanges();
             }
             if (this.componentRef.instance.modalClosed) {
                 this.componentRef.instance.modalClosed.subscribe(() => {
@@ -9002,6 +9119,7 @@ class SidebarCustomModalService {
             this.componentRef.destroy();
             this.componentRef = null;
         }
+        this.resetViewContainerRef();
         const config = this.currentConfig();
         if (config?.onClose) {
             config.onClose();
@@ -9009,6 +9127,20 @@ class SidebarCustomModalService {
         this.isOpen.set(false);
         this.currentConfig.set(null);
     }
+    openDynamicComponentModal(importPath, componentName, data, config) {
+        return import(/* @vite-ignore */ importPath)
+            .then((module) => {
+            const Component = module[componentName];
+            if (!Component) {
+                throw new Error(`Component ${componentName} not found in module ${importPath}`);
+            }
+            this.openComponentModal(Component, data, config);
+        })
+            .catch(error => {
+            console.error('Error loading dynamic component:', componentName, 'from:', importPath, error);
+            throw new Error(`Failed to load component ${componentName} from ${importPath}`);
+        });
+    }
     onBackdropClick() {
         const config = this.currentConfig();
         if (config?.closeOnBackdrop !== false) {
@@ -9271,12 +9403,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 
 class SidebarCustomModalComponent {
     modalService = inject(SidebarCustomModalService);
+    cdr = inject(ChangeDetectorRef);
     dynamicComponent;
-    ngOnInit() {
-        setTimeout(() => {
-            this.modalService.setViewContainerRef(this.dynamicComponent);
+    hasInitializedViewContainerRef = false;
+    currentModalState = false;
+    constructor() {
+        effect(() => {
+            const isOpen = this.modalService.getIsOpen()();
+            if (this.currentModalState && !isOpen) {
+                this.hasInitializedViewContainerRef = false;
+                this.modalService['viewContainerRef'] = null;
+            }
+            this.currentModalState = isOpen;
         });
     }
+    ngAfterViewInit() {
+        this.setupViewContainerRefIfAvailable();
+    }
+    ngAfterViewChecked() {
+        this.setupViewContainerRefIfAvailable();
+    }
+    setupViewContainerRefIfAvailable() {
+        if (!this.modalService.getIsOpen()() || !this.dynamicComponent) {
+            return;
+        }
+        const hasViewContainerRef = !!this.modalService['viewContainerRef'];
+        const hasComponentRef = !!this.modalService['componentRef'];
+        if (!hasViewContainerRef || !this.hasInitializedViewContainerRef) {
+            this.modalService.setViewContainerRef(this.dynamicComponent);
+            this.hasInitializedViewContainerRef = true;
+            setTimeout(() => this.cdr.detectChanges(), 0);
+            const config = this.modalService.getCurrentConfig()();
+            if (config?.component && !hasComponentRef) {
+                setTimeout(() => {
+                    this.modalService.createComponentInstance(config.component, config.data);
+                    this.cdr.detectChanges();
+                }, 0);
+            }
+        }
+    }
     ngOnDestroy() {
         this.modalService.closeModal();
     }
@@ -9298,12 +9463,12 @@ class SidebarCustomModalComponent {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: SidebarCustomModalComponent, isStandalone: true, selector: "core-sidebar-custom-modal", viewQueries: [{ propertyName: "dynamicComponent", first: true, predicate: ["dynamicComponent"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: `
     @if(modalService.getIsOpen()()) {
       <ng-container #dynamicComponent></ng-container>
-          
-        @if(getCurrentConfig()?.template) {
+      
+      @if(getCurrentConfig()?.template) {
         <ng-container 
             *ngTemplateOutlet="getCurrentConfig()!.template!; context: { $implicit: getCurrentConfig()?.data }">
         </ng-container>
-        }
+      }
     }
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
 }
@@ -9316,18 +9481,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                     template: `
     @if(modalService.getIsOpen()()) {
       <ng-container #dynamicComponent></ng-container>
-          
-        @if(getCurrentConfig()?.template) {
+      
+      @if(getCurrentConfig()?.template) {
         <ng-container 
             *ngTemplateOutlet="getCurrentConfig()!.template!; context: { $implicit: getCurrentConfig()?.data }">
         </ng-container>
-        }
+      }
     }
   `,
                 }]
-        }], propDecorators: { dynamicComponent: [{
+        }], ctorParameters: () => [], propDecorators: { dynamicComponent: [{
                 type: ViewChild,
-                args: ['dynamicComponent', { read: ViewContainerRef }]
+                args: ['dynamicComponent', { read: ViewContainerRef, static: false }]
             }] } });
 
 var TimelineStatus;
@@ -9787,11 +9952,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 // Este archivo es generado automáticamente por scripts/update-version.js
 // No edites manualmente este archivo
 const VERSION = {
-    full: '2.11.13',
+    full: '2.11.14',
     major: 2,
     minor: 11,
-    patch: 13,
-    timestamp: '2025-08-22T09:27:21.226Z',
+    patch: 14,
+    timestamp: '2025-08-22T11:07:18.089Z',
     buildDate: '22/8/2025'
 };