@melodicdev/components 1.0.13 → 1.0.15

package/assets/melodic-components.min.js

@@ -16709,6 +16709,9 @@ var Bi = class {
   constructor(e, t) {
     this._dialogID = e, this._dialogEl = t, this._afterOpenedCallback = null, this._afterClosedCallback = null, this._disableClose = !1, this._handleCancel = this.onCancel.bind(this), this._handleBackdropClick = this.onBackdropClick.bind(this), this._dialogEl.addEventListener("cancel", this._handleCancel), this._dialogEl.addEventListener("click", this._handleBackdropClick);
   }
+  updateDialogElement(e) {
+    this._dialogEl.removeEventListener("cancel", this._handleCancel), this._dialogEl.removeEventListener("click", this._handleBackdropClick), this._dialogEl = e, this._dialogEl.addEventListener("cancel", this._handleCancel), this._dialogEl.addEventListener("click", this._handleBackdropClick);
+  }
   get dialogID() {
     return this._dialogID;
   }
@@ -16774,16 +16777,19 @@ var Bi = class {
     return a.dialogRef.open(), a.dialogRef;
   }
   findDialogElement(t) {
-    return this.deepFindDialog(document.body, t);
+    for (const r of document.body.querySelectorAll("*")) if (r.shadowRoot) {
+      const l = this.deepFindDialog(r, t);
+      if (l) return l;
+    }
+    return null;
   }
   deepFindDialog(t, r) {
     const l = t.shadowRoot;
-    if (l) {
-      for (const a of l.querySelectorAll("ml-dialog")) if (a.hasAttribute(`#${r}`)) return a;
-      for (const a of l.querySelectorAll("*")) if (a.shadowRoot) {
-        const o = this.deepFindDialog(a, r);
-        if (o) return o;
-      }
+    if (!l) return null;
+    for (const a of l.querySelectorAll("ml-dialog")) if (a.hasAttribute(`#${r}`)) return a;
+    for (const a of l.querySelectorAll("*")) if (a.shadowRoot) {
+      const o = this.deepFindDialog(a, r);
+      if (o) return o;
     }
     return null;
   }
@@ -16806,6 +16812,9 @@ var nr, Re = class {
   constructor() {
     this._dialogID = Zl(), this._registered = !1;
   }
+  onCreate() {
+    this.registerDialog();
+  }
   registerDialog() {
     if (this._registered) return;
     const t = this.elementRef.shadowRoot?.querySelector("dialog");
@@ -16815,7 +16824,9 @@ var nr, Re = class {
     this._dialogService.removeDialog(this._dialogID);
   }
   open() {
-    this.registerDialog(), this._dialogRef.open();
+    this.registerDialog();
+    const t = this.elementRef.shadowRoot?.querySelector("dialog");
+    t && t !== this._dialogEl && (this._dialogEl = t, this._dialogRef.updateDialogElement(t)), this._dialogRef.open();
   }
   close(t) {
     this._dialogRef.close(t);

package/lib/components/overlays/dialog/dialog-ref.class.d.ts

@@ -2,7 +2,7 @@ import type { UniqueID } from '../../../functions';
 import type { IDialogConfig } from './dialog-config.interface';
 export declare class DialogRef<TResult = unknown, TData = unknown> {
     private readonly _dialogID;
-    private readonly _dialogEl;
+    private _dialogEl;
     private _afterOpenedCallback;
     private _afterClosedCallback;
     private _data;
@@ -10,6 +10,7 @@ export declare class DialogRef<TResult = unknown, TData = unknown> {
     private readonly _handleCancel;
     private readonly _handleBackdropClick;
     constructor(_dialogID: UniqueID, _dialogEl: HTMLDialogElement);
+    updateDialogElement(dialogEl: HTMLDialogElement): void;
     get dialogID(): UniqueID;
     get data(): TData | undefined;
     get disableClose(): boolean;

package/lib/components/overlays/dialog/dialog-ref.class.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-ref.class.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog-ref.class.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,qBAAa,SAAS,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO;IASvD,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAT3B,OAAO,CAAC,oBAAoB,CAA6B;IACzD,OAAO,CAAC,oBAAoB,CAAwD;IACpF,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA4B;IAC1D,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAmC;gBAGtD,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAE,iBAAiB;IAM9C,IAAI,QAAQ,IAAI,QAAQ,CAEvB;IAED,IAAI,IAAI,IAAI,KAAK,GAAG,SAAS,CAE5B;IAED,IAAI,YAAY,IAAI,OAAO,CAE1B;IAED,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,IAAI;IAyB/C,IAAI,IAAI,IAAI;IAKZ,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI;IAK7B,WAAW,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAIvC,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,GAAG,IAAI;IAIlE,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,eAAe;CAKvB"}
+{"version":3,"file":"dialog-ref.class.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog-ref.class.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,qBAAa,SAAS,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO;IASvD,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,SAAS;IATlB,OAAO,CAAC,oBAAoB,CAA6B;IACzD,OAAO,CAAC,oBAAoB,CAAwD;IACpF,OAAO,CAAC,KAAK,CAAoB;IACjC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA4B;IAC1D,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAmC;gBAGtD,SAAS,EAAE,QAAQ,EAC5B,SAAS,EAAE,iBAAiB;IAMrC,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI;IAUtD,IAAI,QAAQ,IAAI,QAAQ,CAEvB;IAED,IAAI,IAAI,IAAI,KAAK,GAAG,SAAS,CAE5B;IAED,IAAI,YAAY,IAAI,OAAO,CAE1B;IAED,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,IAAI;IAyB/C,IAAI,IAAI,IAAI;IAKZ,KAAK,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI;IAK7B,WAAW,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAIvC,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,GAAG,IAAI;IAIlE,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,eAAe;CAKvB"}

package/lib/components/overlays/dialog/dialog-ref.class.js

@@ -10,6 +10,13 @@ export class DialogRef {
         this._dialogEl.addEventListener('cancel', this._handleCancel);
         this._dialogEl.addEventListener('click', this._handleBackdropClick);
     }
+    updateDialogElement(dialogEl) {
+        this._dialogEl.removeEventListener('cancel', this._handleCancel);
+        this._dialogEl.removeEventListener('click', this._handleBackdropClick);
+        this._dialogEl = dialogEl;
+        this._dialogEl.addEventListener('cancel', this._handleCancel);
+        this._dialogEl.addEventListener('click', this._handleBackdropClick);
+    }
     get dialogID() {
         return this._dialogID;
     }

package/lib/components/overlays/dialog/dialog.component.d.ts

@@ -1,11 +1,12 @@
-import type { OnDestroy, IElementRef } from '@melodicdev/core';
-export declare class DialogComponent implements IElementRef, OnDestroy {
+import type { OnCreate, OnDestroy, IElementRef } from '@melodicdev/core';
+export declare class DialogComponent implements IElementRef, OnCreate, OnDestroy {
     elementRef: HTMLElement;
     private readonly _dialogService;
     private _dialogID;
     private _dialogEl;
     private _dialogRef;
     private _registered;
+    onCreate(): void;
     private registerDialog;
     onDestroy(): void;
     open(): void;

package/lib/components/overlays/dialog/dialog.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.component.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog.component.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK/D,qBAMa,eAAgB,YAAW,WAAW,EAAE,SAAS;IACtD,UAAU,EAAG,WAAW,CAAC;IAGhC,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEhD,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,UAAU,CAAa;IAC/B,OAAO,CAAC,WAAW,CAAS;IAE5B,OAAO,CAAC,cAAc;IAatB,SAAS,IAAI,IAAI;IAIjB,IAAI,IAAI,IAAI;IAKZ,KAAK,CAAC,CAAC,GAAG,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC,GAAG,IAAI;IAIpC,OAAO,CAAC,cAAc;CAQtB"}
+{"version":3,"file":"dialog.component.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog.component.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAKzE,qBAMa,eAAgB,YAAW,WAAW,EAAE,QAAQ,EAAE,SAAS;IAChE,UAAU,EAAG,WAAW,CAAC;IAGhC,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEhD,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,UAAU,CAAa;IAC/B,OAAO,CAAC,WAAW,CAAS;IAE5B,QAAQ,IAAI,IAAI;IAIhB,OAAO,CAAC,cAAc;IAatB,SAAS,IAAI,IAAI;IAIjB,IAAI,IAAI,IAAI;IAaZ,KAAK,CAAC,CAAC,GAAG,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC,GAAG,IAAI;IAIpC,OAAO,CAAC,cAAc;CAQtB"}

package/lib/components/overlays/dialog/dialog.component.js

@@ -17,6 +17,9 @@ let DialogComponent = class DialogComponent {
         this._dialogID = newID();
         this._registered = false;
     }
+    onCreate() {
+        this.registerDialog();
+    }
     registerDialog() {
         if (this._registered)
             return;
@@ -34,6 +37,11 @@ let DialogComponent = class DialogComponent {
     }
     open() {
         this.registerDialog();
+        const dialogEl = this.elementRef.shadowRoot?.querySelector('dialog');
+        if (dialogEl && dialogEl !== this._dialogEl) {
+            this._dialogEl = dialogEl;
+            this._dialogRef.updateDialogElement(dialogEl);
+        }
         this._dialogRef.open();
     }
     close(result) {

package/lib/components/overlays/dialog/dialog.service.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.service.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog.service.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAI/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAW/D,qBACa,aAAa;IACzB,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAwC;IAEjE,SAAS,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,GAAG,SAAS;IAerE,YAAY,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI;IAItC,IAAI,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO,EAAE,eAAe,EAAE,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,EAAE,MAAM,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC;IAChJ,IAAI,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAG,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC;IA4CvF,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,cAAc;IAqBtB,KAAK,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,EAAE,CAAC,GAAG,IAAI;IAOxD,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,aAAa;CAGrB"}
+{"version":3,"file":"dialog.service.d.ts","sourceRoot":"","sources":["../../../../src/components/overlays/dialog/dialog.service.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAI/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAW/D,qBACa,aAAa;IACzB,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAwC;IAEjE,SAAS,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,iBAAiB,GAAG,SAAS;IAerE,YAAY,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI;IAItC,IAAI,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO,EAAE,eAAe,EAAE,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,EAAE,MAAM,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC;IAChJ,IAAI,CAAC,OAAO,GAAG,OAAO,EAAE,KAAK,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAG,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC;IA4CvF,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,cAAc;IAoBtB,KAAK,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,EAAE,CAAC,GAAG,IAAI;IAOxD,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,aAAa;CAGrB"}

package/lib/components/overlays/dialog/dialog.service.js

@@ -57,22 +57,30 @@ let DialogService = class DialogService {
         return dialogElements.dialogRef;
     }
     findDialogElement(dialogID) {
-        return this.deepFindDialog(document.body, dialogID);
+        // Traverse all shadow roots starting from document.body's children
+        for (const child of document.body.querySelectorAll('*')) {
+            if (child.shadowRoot) {
+                const result = this.deepFindDialog(child, dialogID);
+                if (result)
+                    return result;
+            }
+        }
+        return null;
     }
     deepFindDialog(root, dialogID) {
         const shadowRoot = root.shadowRoot;
-        if (shadowRoot) {
-            for (const el of shadowRoot.querySelectorAll('ml-dialog')) {
-                if (el.hasAttribute(`#${dialogID}`)) {
-                    return el;
-                }
+        if (!shadowRoot)
+            return null;
+        for (const el of shadowRoot.querySelectorAll('ml-dialog')) {
+            if (el.hasAttribute(`#${dialogID}`)) {
+                return el;
             }
-            for (const child of shadowRoot.querySelectorAll('*')) {
-                if (child.shadowRoot) {
-                    const result = this.deepFindDialog(child, dialogID);
-                    if (result)
-                        return result;
-                }
+        }
+        for (const child of shadowRoot.querySelectorAll('*')) {
+            if (child.shadowRoot) {
+                const result = this.deepFindDialog(child, dialogID);
+                if (result)
+                    return result;
             }
         }
         return null;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@melodicdev/components",
-	"version": "1.0.13",
+	"version": "1.0.15",
 	"description": "Themeable UI component library built on the Melodic Framework",
 	"license": "MIT",
 	"author": "Melodic Development",