@phuong-tran-redoc/document-engine-angular 0.0.25 → 0.0.27

package/fesm2022/phuong-tran-redoc-document-engine-angular.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { HostBinding, Input, Directive, inject, Injectable, ChangeDetectorRef, ElementRef, ViewEncapsulation, ChangeDetectionStrategy, Component, EventEmitter, Output, InjectionToken, HostListener, forwardRef, ContentChildren, ViewChild, ViewChildren, NgZone, ViewContainerRef, EnvironmentInjector, NgModule, ApplicationRef, createComponent, Renderer2 } from '@angular/core';
+import { HostBinding, Input, Directive, inject, Injectable, ElementRef, ViewEncapsulation, ChangeDetectionStrategy, Component, EventEmitter, Output, ChangeDetectorRef, InjectionToken, HostListener, forwardRef, ContentChildren, ViewChild, ViewChildren, NgZone, ViewContainerRef, EnvironmentInjector, NgModule, ApplicationRef, createComponent, Renderer2 } from '@angular/core';
 import { Extension, Editor } from '@tiptap/core';
 import Blockquote from '@tiptap/extension-blockquote';
 import Bold from '@tiptap/extension-bold';
@@ -533,21 +533,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImpo
         }], ctorParameters: () => [] });
 
 class IconComponent {
-    name = '';
-    cdr = inject(ChangeDetectorRef);
+    set name(value) {
+        const svgContent = this.iconRegistry.getIconString(value);
+        const hostElement = this.elementRef.nativeElement;
+        // Set innerHTML to render SVG
+        hostElement.innerHTML = svgContent;
+        // this.cdr.markForCheck();
+    }
+    // private cdr = inject(ChangeDetectorRef);
     elementRef = inject(ElementRef);
     iconRegistry = inject(IconRegistryService);
-    ngOnChanges(changes) {
-        if (changes['name']) {
-            const svgContent = this.iconRegistry.getIconString(this.name);
-            const hostElement = this.elementRef.nativeElement;
-            // Set innerHTML to render SVG
-            hostElement.innerHTML = svgContent;
-            this.cdr.markForCheck();
-        }
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: IconComponent, isStandalone: true, selector: "document-engine-icon", inputs: { name: "name" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.10", type: IconComponent, isStandalone: true, selector: "document-engine-icon", inputs: { name: "name" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: IconComponent, decorators: [{
             type: Component,
@@ -4819,10 +4816,10 @@ class EditorBubbleMenuComponent {
         this.addDocumentClickHandler();
     }
     ngAfterViewInit() {
-        const bubbleElement = this.bubbleElement?.nativeElement;
-        if (bubbleElement) {
-            this.focusTrap.attach(bubbleElement);
-        }
+        // const bubbleElement = this.bubbleElement?.nativeElement;
+        // if (bubbleElement) {
+        //   this.focusTrap.attach(bubbleElement);
+        // }
     }
     ngOnDestroy() {
         if (this.cleanupSelection) {
@@ -4930,8 +4927,11 @@ class EditorBubbleMenuComponent {
         // if (isAttached) {
         //   this.eventManager.detach(this.config.pluginKey);
         // }
+        // Reset force open state
+        this.forceOpen.value = false;
         this.destroyCurrentView();
         this.currentAttributes = {};
+        this.cdr.markForCheck();
     }
     /**
      * Select which view should be shown initially
@@ -4982,6 +4982,9 @@ class EditorBubbleMenuComponent {
         this.currentViewId = viewId;
         // Activate new view
         this.activateView(this.currentViewRef);
+        // Trigger change detection for the child component to render immediately
+        // This is especially important for Angular v14 compatibility
+        this.cdr.markForCheck();
         // Mark bubble as visible for transition handling
         const bubbleElement = this.bubbleElement?.nativeElement;
         if (bubbleElement && this.config.target?.requireFocus) {
@@ -4989,7 +4992,7 @@ class EditorBubbleMenuComponent {
             requestAnimationFrame(() => {
                 bubbleElement.setAttribute('data-visible', 'true');
                 // Re-setup focus trap after view is created (focusable elements may have changed)
-                this.focusTrap.reattach(bubbleElement, true);
+                // this.focusTrap.reattach(bubbleElement, true);
             });
         }
     }