npm - @y14e/portal - Versions diffs - 1.0.2 → 1.0.4 - Mend

@y14e/portal 1.0.2 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.cjs CHANGED Viewed

@@ -269,14 +269,23 @@ function isUngroupedRadio(element) {
 var VISUALLY_HIDDEN_CSS = `border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; user-select: none; white-space: nowrap; width: 1px;`;
 function createPortal(host, container = document.body) {
   if (!(host instanceof Element)) {
-    throw new Error("Invalid host element");
+    console.warn("Invalid host element");
+    return () => {
+    };
+  }
+  if (host.hasAttribute("data-portaled")) {
+    console.warn("Already portaled");
+    return () => {
+    };
   }
   if (!(container instanceof Element)) {
     console.warn("Invalid container element. Fallback: <body> element.");
     container = document.body;
   }
-  if (!containsComposed2(container, host)) {
-    throw new Error("Mismatch elements");
+  if (containsComposed2(host, container)) {
+    console.warn("Host element cannot contain the container element");
+    return () => {
+    };
   }
   const portal = new Portal(host, container);
   return () => portal.destroy();
@@ -317,7 +326,7 @@ var Portal = class {
     this.#exitSentinel.after(this.#host);
     this.#entranceSentinel.remove();
     this.#exitSentinel.remove();
-    this.#host.removeAttribute("data-portal");
+    this.#host.removeAttribute("data-portaled");
   }
   #initialize() {
     this.#host.before(this.#entranceSentinel);
@@ -337,7 +346,7 @@ var Portal = class {
       capture: true,
       signal
     });
-    this.#host.setAttribute("data-portal", "");
+    this.#host.setAttribute("data-portaled", "");
   }
   #onFocusIn = (event) => {
     const current = event.target;
@@ -347,14 +356,14 @@ var Portal = class {
     }
     if (current === this.#entranceSentinel) {
       if (this.#host.contains(before)) {
-        this.#moveFocusOutside("previous");
+        this.#moveFocus("previous");
       } else {
         const first = this.#getFocusables()[0];
         first && focus(first);
       }
     } else if (current === this.#exitSentinel) {
       if (this.#host.contains(before)) {
-        this.#moveFocusOutside("next");
+        this.#moveFocus("next");
       } else {
         const last = this.#getFocusables().at(-1);
         last && focus(last);
@@ -391,6 +400,7 @@ var Portal = class {
   #createSentinel() {
     const sentinel = document.createElement("span");
     sentinel.setAttribute("aria-hidden", "true");
+    sentinel.setAttribute("data-portal-sentinel", "");
     sentinel.setAttribute("tabindex", "0");
     sentinel.style.cssText += VISUALLY_HIDDEN_CSS;
     return sentinel;
@@ -401,7 +411,7 @@ var Portal = class {
       include: (element) => this.#tabIndexes.has(element)
     });
   }
-  #moveFocusOutside(direction) {
+  #moveFocus(direction) {
     const options = {
       anchor: direction === "previous" ? this.#entranceSentinel : this.#exitSentinel,
       composed: true
@@ -435,7 +445,7 @@ function getActiveElement2() {
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.0.2
+ * @version 1.0.4
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.d.cts CHANGED Viewed

@@ -3,7 +3,7 @@
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.0.2
+ * @version 1.0.4
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.0.2
+ * @version 1.0.4
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.js CHANGED Viewed

@@ -267,14 +267,23 @@ function isUngroupedRadio(element) {
 var VISUALLY_HIDDEN_CSS = `border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; user-select: none; white-space: nowrap; width: 1px;`;
 function createPortal(host, container = document.body) {
   if (!(host instanceof Element)) {
-    throw new Error("Invalid host element");
+    console.warn("Invalid host element");
+    return () => {
+    };
+  }
+  if (host.hasAttribute("data-portaled")) {
+    console.warn("Already portaled");
+    return () => {
+    };
   }
   if (!(container instanceof Element)) {
     console.warn("Invalid container element. Fallback: <body> element.");
     container = document.body;
   }
-  if (!containsComposed2(container, host)) {
-    throw new Error("Mismatch elements");
+  if (containsComposed2(host, container)) {
+    console.warn("Host element cannot contain the container element");
+    return () => {
+    };
   }
   const portal = new Portal(host, container);
   return () => portal.destroy();
@@ -315,7 +324,7 @@ var Portal = class {
     this.#exitSentinel.after(this.#host);
     this.#entranceSentinel.remove();
     this.#exitSentinel.remove();
-    this.#host.removeAttribute("data-portal");
+    this.#host.removeAttribute("data-portaled");
   }
   #initialize() {
     this.#host.before(this.#entranceSentinel);
@@ -335,7 +344,7 @@ var Portal = class {
       capture: true,
       signal
     });
-    this.#host.setAttribute("data-portal", "");
+    this.#host.setAttribute("data-portaled", "");
   }
   #onFocusIn = (event) => {
     const current = event.target;
@@ -345,14 +354,14 @@ var Portal = class {
     }
     if (current === this.#entranceSentinel) {
       if (this.#host.contains(before)) {
-        this.#moveFocusOutside("previous");
+        this.#moveFocus("previous");
       } else {
         const first = this.#getFocusables()[0];
         first && focus(first);
       }
     } else if (current === this.#exitSentinel) {
       if (this.#host.contains(before)) {
-        this.#moveFocusOutside("next");
+        this.#moveFocus("next");
       } else {
         const last = this.#getFocusables().at(-1);
         last && focus(last);
@@ -389,6 +398,7 @@ var Portal = class {
   #createSentinel() {
     const sentinel = document.createElement("span");
     sentinel.setAttribute("aria-hidden", "true");
+    sentinel.setAttribute("data-portal-sentinel", "");
     sentinel.setAttribute("tabindex", "0");
     sentinel.style.cssText += VISUALLY_HIDDEN_CSS;
     return sentinel;
@@ -399,7 +409,7 @@ var Portal = class {
       include: (element) => this.#tabIndexes.has(element)
     });
   }
-  #moveFocusOutside(direction) {
+  #moveFocus(direction) {
     const options = {
       anchor: direction === "previous" ? this.#entranceSentinel : this.#exitSentinel,
       composed: true
@@ -433,7 +443,7 @@ function getActiveElement2() {
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.0.2
+ * @version 1.0.4
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@y14e/portal",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "Lightweight DOM portal (teleport) utility with fully focus management",
   "type": "module",
   "main": "./dist/index.cjs",