@zywave/zui-dialog - npm Package Compare versions

Comparing version 4.0.28-pre.0 to 4.0.28-pre.1

dist/custom-elements.json

@@ -15,3 +15,3 @@ {
           "kind": "class",
-          "description": "`<zui-dialog>` is an overlay modal used to focus user's attention.",
+          "description": "`<zui-dialog>` is an overlay modal used to focus user's attention.\nNote: this component depends on `<dialog>` which may not be supported in older browsers. If not using the bundle, you'll require a polyfill. See https://github.com/GoogleChrome/dialog-polyfill for more info.",
           "name": "ZuiDialogElement",
@@ -58,3 +58,3 @@ "slots": [
               "static": true,
-              "default": "new Map<ZuiDialogElement, boolean>()"
+              "default": "new Map<string, boolean>()"
             },
@@ -80,2 +80,7 @@ {
               "kind": "field",
+              "name": "#uuid",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
               "name": "opened",
@@ -82,0 +87,0 @@ "type": {

dist/zui-dialog.d.ts

@@ -5,2 +5,3 @@ import { ZuiBaseElement } from '@zywave/zui-base';
  * `<zui-dialog>` is an overlay modal used to focus user's attention.
+ * Note: this component depends on `<dialog>` which may not be supported in older browsers. If not using the bundle, you'll require a polyfill. See https://github.com/GoogleChrome/dialog-polyfill for more info.
  *
@@ -48,3 +49,2 @@ * @element zui-dialog
     close(confirm?: boolean): void;
-    constructor();
     connectedCallback(): void;
@@ -51,0 +51,0 @@ disconnectedCallback(): void;

dist/zui-dialog.js

@@ -18,3 +18,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 };
-var _ZuiDialogElement_instances, _a, _ZuiDialogElement_instances_1, _ZuiDialogElement_open, _ZuiDialogElement_canceled, _ZuiDialogElement_ensureDialogState, _ZuiDialogElement_dispatchOpenEvent, _ZuiDialogElement_dispatchCloseEvent, _ZuiDialogElement_footerActionHandler, _ZuiDialogElement_wasBackdropClicked, _ZuiDialogElement_toggleHeader, _ZuiDialogElement_toggleFooter;
+var _ZuiDialogElement_instances, _a, _ZuiDialogElement_instances_1, _ZuiDialogElement_open, _ZuiDialogElement_canceled, _ZuiDialogElement_uuid, _ZuiDialogElement_ensureDialogState, _ZuiDialogElement_dispatchOpenEvent, _ZuiDialogElement_dispatchCloseEvent, _ZuiDialogElement_footerActionHandler, _ZuiDialogElement_wasBackdropClicked, _ZuiDialogElement_toggleHeader, _ZuiDialogElement_toggleFooter;
 import { ZuiBaseElement } from '@zywave/zui-base';
@@ -28,2 +28,3 @@ import { html } from 'lit';
  * `<zui-dialog>` is an overlay modal used to focus user's attention.
+ * Note: this component depends on `<dialog>` which may not be supported in older browsers. If not using the bundle, you'll require a polyfill. See https://github.com/GoogleChrome/dialog-polyfill for more info.
  *
@@ -48,6 +49,7 @@ * @element zui-dialog
     constructor() {
-        super();
+        super(...arguments);
         _ZuiDialogElement_instances.add(this);
         _ZuiDialogElement_open.set(this, false);
         _ZuiDialogElement_canceled.set(this, void 0);
+        _ZuiDialogElement_uuid.set(this, window.crypto.randomUUID());
         /**
@@ -57,3 +59,2 @@ * When `true`, users cannot click outside the dialog card, in the translucent overlay, to close the dialog; default allows clicking overlay to close by cancel
         this.noCancelOutsideDialog = false;
-        __classPrivateFieldGet(ZuiDialogElement, _a, "f", _ZuiDialogElement_instances_1).set(this, false);
     }
@@ -108,2 +109,3 @@ static get styles() {
         this.setAttribute('aria-describedby', 'dialogDesc');
+        __classPrivateFieldGet(ZuiDialogElement, _a, "f", _ZuiDialogElement_instances_1).set(__classPrivateFieldGet(this, _ZuiDialogElement_uuid, "f"), false);
     }
@@ -113,3 +115,3 @@ disconnectedCallback() {
         this.close(false);
-        __classPrivateFieldGet(ZuiDialogElement, _a, "f", _ZuiDialogElement_instances_1).delete(this);
+        __classPrivateFieldGet(ZuiDialogElement, _a, "f", _ZuiDialogElement_instances_1).delete(__classPrivateFieldGet(this, _ZuiDialogElement_uuid, "f"));
     }
@@ -121,3 +123,3 @@ async firstUpdated() {
             if (!dialogPolyfill) {
-                console.warn('Dialog polyfill required in this browser. ZUI Dialog will not function. See https://github.com/GoogleChrome/dialog-polyfill for more info');
+                console.warn('Dialog polyfill required in this browser. ZUI Dialog will not function. See https://github.com/GoogleChrome/dialog-polyfill for more info.');
             }
@@ -154,3 +156,3 @@ else {
 }
-_a = ZuiDialogElement, _ZuiDialogElement_open = new WeakMap(), _ZuiDialogElement_canceled = new WeakMap(), _ZuiDialogElement_instances = new WeakSet(), _ZuiDialogElement_ensureDialogState = function _ZuiDialogElement_ensureDialogState(isOpen, retries = 1) {
+_a = ZuiDialogElement, _ZuiDialogElement_open = new WeakMap(), _ZuiDialogElement_canceled = new WeakMap(), _ZuiDialogElement_uuid = new WeakMap(), _ZuiDialogElement_instances = new WeakSet(), _ZuiDialogElement_ensureDialogState = function _ZuiDialogElement_ensureDialogState(isOpen, retries = 1) {
     var _b;
@@ -165,3 +167,3 @@ // isConnected does not appear to function when using a polyfilled dialog implementation (at least, on WebKit)
     }
-    __classPrivateFieldGet(ZuiDialogElement, _a, "f", _ZuiDialogElement_instances_1).set(this, isOpen);
+    __classPrivateFieldGet(ZuiDialogElement, _a, "f", _ZuiDialogElement_instances_1).set(__classPrivateFieldGet(this, _ZuiDialogElement_uuid, "f"), isOpen);
     // we should only call show/showModal/close if the dialog isn't currently in the target state; otherwise native code will throw an exception
@@ -168,0 +170,0 @@ const shadowDialogOpen = (_b = this._dialogElement) === null || _b === void 0 ? void 0 : _b.hasAttribute('open');

package.json

 {
   "name": "@zywave/zui-dialog",
-  "version": "4.0.28-pre.0",
+  "version": "4.0.28-pre.1",
   "main": "dist/index.js",
@@ -28,3 +28,3 @@ "module": "dist/index.js",
   "customElements": "dist/custom-elements.json",
-  "gitHead": "c95a0cd38d4ff0cfef0041cf771575e7c5535a5d"
+  "gitHead": "c79afa88ba8daf809106eab15c87c1ecdf9c9c94"
 }

src/zui-dialog.ts

@@ -11,2 +11,3 @@ import { ZuiBaseElement } from '@zywave/zui-base';
  * `<zui-dialog>` is an overlay modal used to focus user's attention.
+ * Note: this component depends on `<dialog>` which may not be supported in older browsers. If not using the bundle, you'll require a polyfill. See https://github.com/GoogleChrome/dialog-polyfill for more info.
  *
@@ -29,3 +30,2 @@ * @element zui-dialog
  */
-
 export class ZuiDialogElement extends ZuiBaseElement {
@@ -38,3 +38,3 @@ @queryAssignedNodes({ slot: 'header' })
 
-  static #instances = new Map<ZuiDialogElement, boolean>();
+  static #instances = new Map<string, boolean>();
   static get styles() {
@@ -46,2 +46,3 @@ return [super.styles, style];
   #canceled?: boolean | null | undefined;
+  #uuid = window.crypto.randomUUID();
 
@@ -103,7 +104,2 @@ /**
 
-  constructor() {
-    super();
-    ZuiDialogElement.#instances.set(this, false);
-  }
-
   connectedCallback() {
@@ -114,2 +110,4 @@ super.connectedCallback();
     this.setAttribute('aria-describedby', 'dialogDesc');
+
+    ZuiDialogElement.#instances.set(this.#uuid, false);
   }
@@ -120,3 +118,3 @@
     this.close(false);
-    ZuiDialogElement.#instances.delete(this);
+    ZuiDialogElement.#instances.delete(this.#uuid);
   }
@@ -129,3 +127,3 @@
         console.warn(
-          'Dialog polyfill required in this browser. ZUI Dialog will not function. See https://github.com/GoogleChrome/dialog-polyfill for more info'
+          'Dialog polyfill required in this browser. ZUI Dialog will not function. See https://github.com/GoogleChrome/dialog-polyfill for more info.'
         );
@@ -157,3 +155,3 @@ } else {
 
-    ZuiDialogElement.#instances.set(this, isOpen);
+    ZuiDialogElement.#instances.set(this.#uuid, isOpen);
 
@@ -160,0 +158,0 @@ // we should only call show/showModal/close if the dialog isn't currently in the target state; otherwise native code will throw an exception

No alert changes

Improved metrics

Total package byte prevSize

109503

increased by1.43%

Lines of code

1133

increased by0.62%

No dependency changes