@ship-ui/core 0.15.5 → 0.15.7

package/fesm2022/ship-ui-core.mjs

@@ -369,13 +369,15 @@ class ShipDialogComponent {
         this.abortController = null;
         this.isOpenEffect = effect(() => {
             const dialogEl = this.dialogRef()?.nativeElement;
+            if (!dialogEl)
+                return;
             if (this.abortController) {
                 this.abortController.abort();
             }
             this.abortController = new AbortController();
             if (this.isOpen()) {
-                dialogEl?.showModal();
-                dialogEl?.addEventListener('close', () => {
+                dialogEl.showModal();
+                dialogEl.addEventListener('close', () => {
                     this.isOpen.set(false);
                     this.closed.emit();
                 }, {
@@ -393,8 +395,8 @@ class ShipDialogComponent {
                 });
             }
             else {
-                this.closed.emit();
-                dialogEl?.close();
+                dialogEl.close();
+                queueMicrotask(() => this.closed.emit());
             }
         }, ...(ngDevMode ? [{ debugName: "isOpenEffect" }] : []));
     }
@@ -406,22 +408,25 @@ class ShipDialogComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ShipDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ShipDialogComponent, isStandalone: true, selector: "sh-dialog", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", closed: "closed" }, viewQueries: [{ propertyName: "dialogRef", first: true, predicate: ["dialogRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @let options = this.defaultOptionMerge();
-    <dialog
-      shDialog
-      #dialogRef
-      [class]="options.class"
-      [style.width]="options.width ?? ''"
-      [style.max-width]="options.maxWidth ?? ''"
-      [style.max-height]="options.maxHeight ?? ''"
-      [style.height]="options.height ?? ''">
-      <div class="content">
-        <ng-content />
-      </div>
 
-      @if (this.defaultOptionMerge().closeOnOutsideClick) {
-        <div class="closeable-overlay" (click)="isOpen.set(false)"></div>
-      }
-    </dialog>
+    @if (isOpen()) {
+      <dialog
+        shDialog
+        #dialogRef
+        [class]="options.class"
+        [style.width]="options.width ?? ''"
+        [style.max-width]="options.maxWidth ?? ''"
+        [style.max-height]="options.maxHeight ?? ''"
+        [style.height]="options.height ?? ''">
+        <div class="content">
+          <ng-content />
+        </div>
+
+        @if (this.defaultOptionMerge().closeOnOutsideClick) {
+          <div class="closeable-overlay" (click)="isOpen.set(false)"></div>
+        }
+      </dialog>
+    }
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ShipDialogComponent, decorators: [{
@@ -431,22 +436,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
                     imports: [],
                     template: `
     @let options = this.defaultOptionMerge();
-    <dialog
-      shDialog
-      #dialogRef
-      [class]="options.class"
-      [style.width]="options.width ?? ''"
-      [style.max-width]="options.maxWidth ?? ''"
-      [style.max-height]="options.maxHeight ?? ''"
-      [style.height]="options.height ?? ''">
-      <div class="content">
-        <ng-content />
-      </div>
 
-      @if (this.defaultOptionMerge().closeOnOutsideClick) {
-        <div class="closeable-overlay" (click)="isOpen.set(false)"></div>
-      }
-    </dialog>
+    @if (isOpen()) {
+      <dialog
+        shDialog
+        #dialogRef
+        [class]="options.class"
+        [style.width]="options.width ?? ''"
+        [style.max-width]="options.maxWidth ?? ''"
+        [style.max-height]="options.maxHeight ?? ''"
+        [style.height]="options.height ?? ''">
+        <div class="content">
+          <ng-content />
+        </div>
+
+        @if (this.defaultOptionMerge().closeOnOutsideClick) {
+          <div class="closeable-overlay" (click)="isOpen.set(false)"></div>
+        }
+      </dialog>
+    }
   `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]