@pepperi-addons/ngx-lib 0.4.0-angular14.36 → 0.4.0-angular14.39

package/fesm2020/pepperi-addons-ngx-lib-page-layout.mjs

@@ -6,71 +6,71 @@ import { MatCommonModule } from '@angular/material/core';
 import * as i1 from '@pepperi-addons/ngx-lib';
 import { PepNgxLibModule } from '@pepperi-addons/ngx-lib';
 
-class PepPageLayoutComponent {
-    constructor(customizationService, layoutService, cdRef, hostElement, renderer) {
-        this.customizationService = customizationService;
-        this.layoutService = layoutService;
-        this.cdRef = cdRef;
-        this.hostElement = hostElement;
-        this.renderer = renderer;
-        this.addPadding = false;
-        this.showShadow = false;
-        this.renderer.addClass(this.hostElement.nativeElement, 'pep-page-layout');
-    }
-    ngAfterViewInit() {
-        this.layoutService.onResize$.subscribe((size) => {
-            this.screenSize = size;
-        });
-    }
-    ngAfterContentInit() {
-        //
-    }
-}
-PepPageLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutComponent, deps: [{ token: i1.PepCustomizationService }, { token: i1.PepLayoutService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-PepPageLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepPageLayoutComponent, selector: "pep-page-layout", inputs: { addPadding: "addPadding", showShadow: "showShadow" }, ngImport: i0, template: "<div class=\"pep-page-header-layout\">\n    <ng-content select=\"[pep-header-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar\"></ng-content>\n    <ng-content select=\"[pep-side-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout side-layout-end\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar[position='end']\"></ng-content>\n    <ng-content select=\"[pep-side-area-end]\"></ng-content>\n</div>\n<div class=\"pep-page-main-layout\" [ngClass]=\"{ 'add-padding': addPadding }\">\n    <div class=\"pep-top-area\">\n        <ng-content select=\"[pep-top-area]\"></ng-content>\n    </div>\n    <div class=\"pep-main-area\">\n        <ng-content select=\"[pep-main-area]\"></ng-content>\n    </div>\n</div>", styles: [":host.pep-page-layout{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;grid-template-areas:\"header-layout  header-layout   header-layout\" \"side-layout    main-layout     side-layout-end\";height:100%;width:100%;overflow:hidden}:host.pep-page-layout .pep-page-header-layout{grid-area:header-layout;z-index:10}:host.pep-page-layout .pep-page-side-layout{grid-area:side-layout;overflow:hidden;height:100%;z-index:5}:host.pep-page-layout .pep-page-side-layout.show-shadow{padding-inline-end:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-side-layout.side-layout-end{grid-area:side-layout-end}:host.pep-page-layout .pep-page-side-layout.side-layout-end.show-shadow{padding-inline-start:var(--pep-spacing-lg, 1rem);padding-inline-end:unset}:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area],:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area-end]{height:inherit}:host.pep-page-layout .pep-page-main-layout{grid-area:main-layout;overflow:hidden;height:100%;z-index:1;padding-bottom:var(--pep-footer-bar-height, 4.5rem);display:grid;grid-template-rows:auto 1fr;grid-template-areas:\"top-area\" \"main-area\"}:host.pep-page-layout .pep-page-main-layout.add-padding{padding-inline:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-main-layout .pep-top-area{grid-area:top-area}:host.pep-page-layout .pep-page-main-layout .pep-main-area{grid-area:main-area;overflow:auto;height:100%;display:block}:host.pep-page-layout .pep-page-main-layout .pep-main-area>*{height:inherit}\n", ".pep-page-side-layout.show-shadow{box-shadow:var(--pep-shadow-md-offset, 0 .5rem 1rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'pep-page-layout', template: "<div class=\"pep-page-header-layout\">\n    <ng-content select=\"[pep-header-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar\"></ng-content>\n    <ng-content select=\"[pep-side-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout side-layout-end\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar[position='end']\"></ng-content>\n    <ng-content select=\"[pep-side-area-end]\"></ng-content>\n</div>\n<div class=\"pep-page-main-layout\" [ngClass]=\"{ 'add-padding': addPadding }\">\n    <div class=\"pep-top-area\">\n        <ng-content select=\"[pep-top-area]\"></ng-content>\n    </div>\n    <div class=\"pep-main-area\">\n        <ng-content select=\"[pep-main-area]\"></ng-content>\n    </div>\n</div>", styles: [":host.pep-page-layout{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;grid-template-areas:\"header-layout  header-layout   header-layout\" \"side-layout    main-layout     side-layout-end\";height:100%;width:100%;overflow:hidden}:host.pep-page-layout .pep-page-header-layout{grid-area:header-layout;z-index:10}:host.pep-page-layout .pep-page-side-layout{grid-area:side-layout;overflow:hidden;height:100%;z-index:5}:host.pep-page-layout .pep-page-side-layout.show-shadow{padding-inline-end:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-side-layout.side-layout-end{grid-area:side-layout-end}:host.pep-page-layout .pep-page-side-layout.side-layout-end.show-shadow{padding-inline-start:var(--pep-spacing-lg, 1rem);padding-inline-end:unset}:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area],:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area-end]{height:inherit}:host.pep-page-layout .pep-page-main-layout{grid-area:main-layout;overflow:hidden;height:100%;z-index:1;padding-bottom:var(--pep-footer-bar-height, 4.5rem);display:grid;grid-template-rows:auto 1fr;grid-template-areas:\"top-area\" \"main-area\"}:host.pep-page-layout .pep-page-main-layout.add-padding{padding-inline:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-main-layout .pep-top-area{grid-area:top-area}:host.pep-page-layout .pep-page-main-layout .pep-main-area{grid-area:main-area;overflow:auto;height:100%;display:block}:host.pep-page-layout .pep-page-main-layout .pep-main-area>*{height:inherit}\n", ".pep-page-side-layout.show-shadow{box-shadow:var(--pep-shadow-md-offset, 0 .5rem 1rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.PepCustomizationService }, { type: i1.PepLayoutService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { addPadding: [{
-                type: Input
-            }], showShadow: [{
-                type: Input
+class PepPageLayoutComponent {
+    constructor(customizationService, layoutService, cdRef, hostElement, renderer) {
+        this.customizationService = customizationService;
+        this.layoutService = layoutService;
+        this.cdRef = cdRef;
+        this.hostElement = hostElement;
+        this.renderer = renderer;
+        this.addPadding = false;
+        this.showShadow = false;
+        this.renderer.addClass(this.hostElement.nativeElement, 'pep-page-layout');
+    }
+    ngAfterViewInit() {
+        this.layoutService.onResize$.subscribe((size) => {
+            this.screenSize = size;
+        });
+    }
+    ngAfterContentInit() {
+        //
+    }
+}
+PepPageLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutComponent, deps: [{ token: i1.PepCustomizationService }, { token: i1.PepLayoutService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+PepPageLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepPageLayoutComponent, selector: "pep-page-layout", inputs: { addPadding: "addPadding", showShadow: "showShadow" }, ngImport: i0, template: "<div class=\"pep-page-header-layout\">\n    <ng-content select=\"[pep-header-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar\"></ng-content>\n    <ng-content select=\"[pep-side-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout side-layout-end\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar[position='end']\"></ng-content>\n    <ng-content select=\"[pep-side-area-end]\"></ng-content>\n</div>\n<div class=\"pep-page-main-layout\" [ngClass]=\"{ 'add-padding': addPadding }\">\n    <div class=\"pep-top-area\">\n        <ng-content select=\"[pep-top-area]\"></ng-content>\n    </div>\n    <div class=\"pep-main-area\">\n        <ng-content select=\"[pep-main-area]\"></ng-content>\n    </div>\n</div>", styles: [":host.pep-page-layout{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;grid-template-areas:\"header-layout  header-layout   header-layout\" \"side-layout    main-layout     side-layout-end\";height:100%;width:100%;overflow:hidden}:host.pep-page-layout .pep-page-header-layout{grid-area:header-layout;z-index:10}:host.pep-page-layout .pep-page-side-layout{grid-area:side-layout;overflow:hidden;height:100%;z-index:5}:host.pep-page-layout .pep-page-side-layout.show-shadow{padding-inline-end:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-side-layout.side-layout-end{grid-area:side-layout-end}:host.pep-page-layout .pep-page-side-layout.side-layout-end.show-shadow{padding-inline-start:var(--pep-spacing-lg, 1rem);padding-inline-end:unset}:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area],:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area-end]{height:inherit}:host.pep-page-layout .pep-page-main-layout{grid-area:main-layout;overflow:hidden;height:100%;z-index:1;padding-bottom:var(--pep-footer-bar-height, 4.5rem);display:grid;grid-template-rows:auto 1fr;grid-template-areas:\"top-area\" \"main-area\"}:host.pep-page-layout .pep-page-main-layout.add-padding{padding-inline:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-main-layout .pep-top-area{grid-area:top-area}:host.pep-page-layout .pep-page-main-layout .pep-main-area{grid-area:main-area;overflow:auto;height:100%;display:block}:host.pep-page-layout .pep-page-main-layout .pep-main-area>*{height:inherit}\n", ".pep-page-side-layout.show-shadow{box-shadow:var(--pep-shadow-md-offset, 0 .5rem 1rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pep-page-layout', template: "<div class=\"pep-page-header-layout\">\n    <ng-content select=\"[pep-header-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar\"></ng-content>\n    <ng-content select=\"[pep-side-area]\"></ng-content>\n</div>\n<div class=\"pep-page-side-layout side-layout-end\" [ngClass]=\"{ 'show-shadow': showShadow }\">\n    <ng-content select=\"pep-side-bar[position='end']\"></ng-content>\n    <ng-content select=\"[pep-side-area-end]\"></ng-content>\n</div>\n<div class=\"pep-page-main-layout\" [ngClass]=\"{ 'add-padding': addPadding }\">\n    <div class=\"pep-top-area\">\n        <ng-content select=\"[pep-top-area]\"></ng-content>\n    </div>\n    <div class=\"pep-main-area\">\n        <ng-content select=\"[pep-main-area]\"></ng-content>\n    </div>\n</div>", styles: [":host.pep-page-layout{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;grid-template-areas:\"header-layout  header-layout   header-layout\" \"side-layout    main-layout     side-layout-end\";height:100%;width:100%;overflow:hidden}:host.pep-page-layout .pep-page-header-layout{grid-area:header-layout;z-index:10}:host.pep-page-layout .pep-page-side-layout{grid-area:side-layout;overflow:hidden;height:100%;z-index:5}:host.pep-page-layout .pep-page-side-layout.show-shadow{padding-inline-end:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-side-layout.side-layout-end{grid-area:side-layout-end}:host.pep-page-layout .pep-page-side-layout.side-layout-end.show-shadow{padding-inline-start:var(--pep-spacing-lg, 1rem);padding-inline-end:unset}:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area],:host.pep-page-layout .pep-page-side-layout ::ng-deep div[pep-side-area-end]{height:inherit}:host.pep-page-layout .pep-page-main-layout{grid-area:main-layout;overflow:hidden;height:100%;z-index:1;padding-bottom:var(--pep-footer-bar-height, 4.5rem);display:grid;grid-template-rows:auto 1fr;grid-template-areas:\"top-area\" \"main-area\"}:host.pep-page-layout .pep-page-main-layout.add-padding{padding-inline:var(--pep-spacing-lg, 1rem)}:host.pep-page-layout .pep-page-main-layout .pep-top-area{grid-area:top-area}:host.pep-page-layout .pep-page-main-layout .pep-main-area{grid-area:main-area;overflow:auto;height:100%;display:block}:host.pep-page-layout .pep-page-main-layout .pep-main-area>*{height:inherit}\n", ".pep-page-side-layout.show-shadow{box-shadow:var(--pep-shadow-md-offset, 0 .5rem 1rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.32)}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.PepCustomizationService }, { type: i1.PepLayoutService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { addPadding: [{
+                type: Input
+            }], showShadow: [{
+                type: Input
             }] } });
 
-class PepPageLayoutModule {
-}
-PepPageLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PepPageLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, declarations: [PepPageLayoutComponent], imports: [CommonModule,
-        // Material modules,
-        MatCommonModule,
-        // ngx-lib modules
-        PepNgxLibModule], exports: [PepPageLayoutComponent] });
-PepPageLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, imports: [CommonModule,
-        // Material modules,
-        MatCommonModule,
-        // ngx-lib modules
-        PepNgxLibModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        // Material modules,
-                        MatCommonModule,
-                        // ngx-lib modules
-                        PepNgxLibModule,
-                    ],
-                    exports: [PepPageLayoutComponent],
-                    declarations: [PepPageLayoutComponent],
-                }]
+class PepPageLayoutModule {
+}
+PepPageLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PepPageLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, declarations: [PepPageLayoutComponent], imports: [CommonModule,
+        // Material modules,
+        MatCommonModule,
+        // ngx-lib modules
+        PepNgxLibModule], exports: [PepPageLayoutComponent] });
+PepPageLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, imports: [CommonModule,
+        // Material modules,
+        MatCommonModule,
+        // ngx-lib modules
+        PepNgxLibModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPageLayoutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        // Material modules,
+                        MatCommonModule,
+                        // ngx-lib modules
+                        PepNgxLibModule,
+                    ],
+                    exports: [PepPageLayoutComponent],
+                    declarations: [PepPageLayoutComponent],
+                }]
         }] });
 
-/*
- * Public API Surface of ngx-lib/page-layout
+/*
+ * Public API Surface of ngx-lib/page-layout
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { PepPageLayoutComponent, PepPageLayoutModule };

package/fesm2020/pepperi-addons-ngx-lib-plugin.mjs

@@ -3,106 +3,106 @@ import { EventEmitter, ViewContainerRef, Component, ViewChild, Input, Output } f
 import { loadRemoteModule } from '@angular-architects/module-federation';
 import * as i1 from '@pepperi-addons/ngx-lib';
 
-// declare let __webpack_public_path__;
-class PepPluginProxyComponent {
-    constructor(pepAddonService) {
-        this.pepAddonService = pepAddonService;
-        this._options = null;
-        // This is the data passed by the API Design documentation.
-        this._hostObject = null;
-        this.hostEvents = new EventEmitter();
-        this.load = new EventEmitter();
-    }
-    set options(value) {
-        this._options = value;
-        if (value) {
-            this.loadModule();
-        }
-    }
-    get options() {
-        return this._options;
-    }
-    set hostObject(value) {
-        this._hostObject = value;
-        this.setHostComponentIntoComponentRef();
-    }
-    get hostObject() {
-        return this._hostObject;
-    }
-    setHostComponentIntoComponentRef() {
-        if (this.hostObject && this.compRef?.instance) {
-            this.compRef.instance['hostObject'] = this.hostObject;
-            // TODO: Check if this is needed?? if not remove this.
-            // if (this.compRef?.instance?.ngOnChanges) {
-            //     this.compRef.instance.ngOnChanges(this.hostObject);
-            // }
-        }
-    }
-    async loadModule() {
-        this.viewContainer.clear();
-        debugger;
-        if (this.options?.addonId && (this.options.type === 'module' || this.options.type === 'script')) {
-            const lastSlashIndex = this.options.remoteEntry?.lastIndexOf('/') || -1;
-            if (lastSlashIndex > 0) {
-                // const publicPathArr = this.options.remoteEntry?.split('/');
-                // const publicPath = publicPathArr.slice(0, publicPathArr.length - 1).join('/')+'/';
-                // __webpack_public_path__ = publicPath;
-                const publicPath = this.options.remoteEntry.substring(0, lastSlashIndex + 1);
-                this.pepAddonService.setAddonStaticFolder(publicPath, this.options.addonId);
-            }
-        }
-        const componentType = await loadRemoteModule(this.options).then(m => m[this.options.componentName]);
-        this.compRef = this.viewContainer.createComponent(componentType);
-        if (this.compRef) {
-            this.setHostComponentIntoComponentRef();
-            this.hostEvents$ = this.compRef.instance['hostEvents']?.subscribe((e) => {
-                this.hostEvents.emit(e);
-            });
-        }
-        this.load.emit();
-    }
-    ngOnChanges() {
-    }
-    ngOnDestroy() {
-        if (this.hostEvents$) {
-            this.hostEvents$.unsubscribe();
-        }
-        this.compRef?.destroy();
-        this.viewContainer?.clear();
-    }
-}
-PepPluginProxyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPluginProxyComponent, deps: [{ token: i1.PepAddonService }], target: i0.ɵɵFactoryTarget.Component });
+// declare let __webpack_public_path__;
+class PepPluginProxyComponent {
+    constructor(pepAddonService) {
+        this.pepAddonService = pepAddonService;
+        this._options = null;
+        // This is the data passed by the API Design documentation.
+        this._hostObject = null;
+        this.hostEvents = new EventEmitter();
+        this.load = new EventEmitter();
+    }
+    set options(value) {
+        this._options = value;
+        if (value) {
+            this.loadModule();
+        }
+    }
+    get options() {
+        return this._options;
+    }
+    set hostObject(value) {
+        this._hostObject = value;
+        this.setHostComponentIntoComponentRef();
+    }
+    get hostObject() {
+        return this._hostObject;
+    }
+    setHostComponentIntoComponentRef() {
+        if (this.hostObject && this.compRef?.instance) {
+            this.compRef.instance['hostObject'] = this.hostObject;
+            // TODO: Check if this is needed?? if not remove this.
+            // if (this.compRef?.instance?.ngOnChanges) {
+            //     this.compRef.instance.ngOnChanges(this.hostObject);
+            // }
+        }
+    }
+    async loadModule() {
+        this.viewContainer.clear();
+        debugger;
+        if (this.options?.addonId && (this.options.type === 'module' || this.options.type === 'script')) {
+            const lastSlashIndex = this.options.remoteEntry?.lastIndexOf('/') || -1;
+            if (lastSlashIndex > 0) {
+                // const publicPathArr = this.options.remoteEntry?.split('/');
+                // const publicPath = publicPathArr.slice(0, publicPathArr.length - 1).join('/')+'/';
+                // __webpack_public_path__ = publicPath;
+                const publicPath = this.options.remoteEntry.substring(0, lastSlashIndex + 1);
+                this.pepAddonService.setAddonStaticFolder(publicPath, this.options.addonId);
+            }
+        }
+        const componentType = await loadRemoteModule(this.options).then(m => m[this.options.componentName]);
+        this.compRef = this.viewContainer.createComponent(componentType);
+        if (this.compRef) {
+            this.setHostComponentIntoComponentRef();
+            this.hostEvents$ = this.compRef.instance['hostEvents']?.subscribe((e) => {
+                this.hostEvents.emit(e);
+            });
+        }
+        this.load.emit();
+    }
+    ngOnChanges() {
+    }
+    ngOnDestroy() {
+        if (this.hostEvents$) {
+            this.hostEvents$.unsubscribe();
+        }
+        this.compRef?.destroy();
+        this.viewContainer?.clear();
+    }
+}
+PepPluginProxyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPluginProxyComponent, deps: [{ token: i1.PepAddonService }], target: i0.ɵɵFactoryTarget.Component });
 PepPluginProxyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepPluginProxyComponent, isStandalone: true, selector: "pep-plugin-proxy", inputs: { options: "options", hostObject: "hostObject" }, outputs: { hostEvents: "hostEvents", load: "load" }, viewQueries: [{ propertyName: "viewContainer", first: true, predicate: ["placeHolder"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
         <ng-container #placeHolder></ng-container>
-    `, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPluginProxyComponent, decorators: [{
-            type: Component,
-            args: [{
-                    standalone: true,
-                    selector: 'pep-plugin-proxy',
+    `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepPluginProxyComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: 'pep-plugin-proxy',
                     template: `
         <ng-container #placeHolder></ng-container>
-    `
-                }]
-        }], ctorParameters: function () { return [{ type: i1.PepAddonService }]; }, propDecorators: { viewContainer: [{
-                type: ViewChild,
-                args: ['placeHolder', { read: ViewContainerRef, static: true }]
-            }], options: [{
-                type: Input
-            }], hostObject: [{
-                type: Input
-            }], hostEvents: [{
-                type: Output
-            }], load: [{
-                type: Output
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.PepAddonService }]; }, propDecorators: { viewContainer: [{
+                type: ViewChild,
+                args: ['placeHolder', { read: ViewContainerRef, static: true }]
+            }], options: [{
+                type: Input
+            }], hostObject: [{
+                type: Input
+            }], hostEvents: [{
+                type: Output
+            }], load: [{
+                type: Output
             }] } });
 
-/*
- * Public API Surface of ngx-lib/plugin
+/*
+ * Public API Surface of ngx-lib/plugin
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { PepPluginProxyComponent };