@y14e/portal 1.2.27 → 1.2.28

package/README.md

@@ -13,11 +13,11 @@ npm i @y14e/portal
 import { createPortal } from '@y14e/portal';
 
 // CDNs
-import { createPortal } from 'https://esm.sh/@y14e/portal@1.2.27';
+import { createPortal } from 'https://esm.sh/@y14e/portal@1.2.28';
 // or
-import { createPortal } from 'https://cdn.jsdelivr.net/npm/@y14e/portal@1.2.27/+esm';
+import { createPortal } from 'https://cdn.jsdelivr.net/npm/@y14e/portal@1.2.28/+esm';
 // or
-import { createPortal } from 'https://esm.unpkg.com/@y14e/portal@1.2.27';
+import { createPortal } from 'https://esm.unpkg.com/@y14e/portal@1.2.28';
 ```
 
 ## 📦 APIs

package/dist/index.bundle.cjs

@@ -388,7 +388,6 @@ var Portal = class {
   #exitSentinel;
   #focusables = /* @__PURE__ */ new Set();
   #controller = null;
-  #timer;
   #isDestroyed = false;
   constructor(host, container) {
     this.#host = host;
@@ -408,10 +407,6 @@ var Portal = class {
     this.#isDestroyed = true;
     this.#controller?.abort();
     this.#controller = null;
-    if (this.#timer !== void 0) {
-      cancelAnimationFrame(this.#timer);
-      this.#timer = void 0;
-    }
     restoreAttributes([...this.#focusables]);
     this.#focusables.clear();
     this.#exitSentinel.after(this.#host);
@@ -448,15 +443,7 @@ var Portal = class {
       }
       this.#update();
       const first = [...this.#focusables][0];
-      if (first) {
-        focusElement(first);
-      } else {
-        const next = getNextFocusable(document.body, {
-          anchor: this.#exitSentinel,
-          composed: true
-        });
-        next && focusElement(next);
-      }
+      first ? focusElement(first) : this.#moveFocus("next");
     } else {
       if (this.#host.contains(previous)) {
         this.#moveFocus("next");
@@ -464,15 +451,7 @@ var Portal = class {
       }
       this.#update();
       const last = [...this.#focusables].at(-1);
-      if (last) {
-        focusElement(last);
-      } else {
-        const previous2 = getPreviousFocusable(document.body, {
-          anchor: this.#entranceSentinel,
-          composed: true
-        });
-        previous2 && focusElement(previous2);
-      }
+      last ? focusElement(last) : this.#moveFocus("previous");
     }
   };
   #onKeyDown = (event) => {
@@ -526,13 +505,7 @@ var Portal = class {
     return sentinel;
   }
   #focusSentinel(isPrevious) {
-    const sentinel = isPrevious ? this.#entranceSentinel : this.#exitSentinel;
-    if (isPrevious) {
-      sentinel.focus();
-    } else {
-      this.#timer && cancelAnimationFrame(this.#timer);
-      this.#timer = requestAnimationFrame(() => sentinel.focus());
-    }
+    (isPrevious ? this.#entranceSentinel : this.#exitSentinel).focus();
   }
   #getFocusables() {
     return getFocusables(this.#host, {
@@ -564,7 +537,7 @@ function containsComposed2(container, element) {
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.2.27
+ * @version 1.2.28
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.bundle.js

@@ -386,7 +386,6 @@ var Portal = class {
   #exitSentinel;
   #focusables = /* @__PURE__ */ new Set();
   #controller = null;
-  #timer;
   #isDestroyed = false;
   constructor(host, container) {
     this.#host = host;
@@ -406,10 +405,6 @@ var Portal = class {
     this.#isDestroyed = true;
     this.#controller?.abort();
     this.#controller = null;
-    if (this.#timer !== void 0) {
-      cancelAnimationFrame(this.#timer);
-      this.#timer = void 0;
-    }
     restoreAttributes([...this.#focusables]);
     this.#focusables.clear();
     this.#exitSentinel.after(this.#host);
@@ -446,15 +441,7 @@ var Portal = class {
       }
       this.#update();
       const first = [...this.#focusables][0];
-      if (first) {
-        focusElement(first);
-      } else {
-        const next = getNextFocusable(document.body, {
-          anchor: this.#exitSentinel,
-          composed: true
-        });
-        next && focusElement(next);
-      }
+      first ? focusElement(first) : this.#moveFocus("next");
     } else {
       if (this.#host.contains(previous)) {
         this.#moveFocus("next");
@@ -462,15 +449,7 @@ var Portal = class {
       }
       this.#update();
       const last = [...this.#focusables].at(-1);
-      if (last) {
-        focusElement(last);
-      } else {
-        const previous2 = getPreviousFocusable(document.body, {
-          anchor: this.#entranceSentinel,
-          composed: true
-        });
-        previous2 && focusElement(previous2);
-      }
+      last ? focusElement(last) : this.#moveFocus("previous");
     }
   };
   #onKeyDown = (event) => {
@@ -524,13 +503,7 @@ var Portal = class {
     return sentinel;
   }
   #focusSentinel(isPrevious) {
-    const sentinel = isPrevious ? this.#entranceSentinel : this.#exitSentinel;
-    if (isPrevious) {
-      sentinel.focus();
-    } else {
-      this.#timer && cancelAnimationFrame(this.#timer);
-      this.#timer = requestAnimationFrame(() => sentinel.focus());
-    }
+    (isPrevious ? this.#entranceSentinel : this.#exitSentinel).focus();
   }
   #getFocusables() {
     return getFocusables(this.#host, {
@@ -562,7 +535,7 @@ function containsComposed2(container, element) {
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.2.27
+ * @version 1.2.28
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.cjs

@@ -31,7 +31,6 @@ var Portal = class {
   #exitSentinel;
   #focusables = /* @__PURE__ */ new Set();
   #controller = null;
-  #timer;
   #isDestroyed = false;
   constructor(host, container) {
     this.#host = host;
@@ -51,10 +50,6 @@ var Portal = class {
     this.#isDestroyed = true;
     this.#controller?.abort();
     this.#controller = null;
-    if (this.#timer !== void 0) {
-      cancelAnimationFrame(this.#timer);
-      this.#timer = void 0;
-    }
     attributesUtils.restoreAttributes([...this.#focusables]);
     this.#focusables.clear();
     this.#exitSentinel.after(this.#host);
@@ -91,15 +86,7 @@ var Portal = class {
       }
       this.#update();
       const first = [...this.#focusables][0];
-      if (first) {
-        powerFocusable.focusElement(first);
-      } else {
-        const next = powerFocusable.getNextFocusable(document.body, {
-          anchor: this.#exitSentinel,
-          composed: true
-        });
-        next && powerFocusable.focusElement(next);
-      }
+      first ? powerFocusable.focusElement(first) : this.#moveFocus("next");
     } else {
       if (this.#host.contains(previous)) {
         this.#moveFocus("next");
@@ -107,15 +94,7 @@ var Portal = class {
       }
       this.#update();
       const last = [...this.#focusables].at(-1);
-      if (last) {
-        powerFocusable.focusElement(last);
-      } else {
-        const previous2 = powerFocusable.getPreviousFocusable(document.body, {
-          anchor: this.#entranceSentinel,
-          composed: true
-        });
-        previous2 && powerFocusable.focusElement(previous2);
-      }
+      last ? powerFocusable.focusElement(last) : this.#moveFocus("previous");
     }
   };
   #onKeyDown = (event) => {
@@ -169,13 +148,7 @@ var Portal = class {
     return sentinel;
   }
   #focusSentinel(isPrevious) {
-    const sentinel = isPrevious ? this.#entranceSentinel : this.#exitSentinel;
-    if (isPrevious) {
-      sentinel.focus();
-    } else {
-      this.#timer && cancelAnimationFrame(this.#timer);
-      this.#timer = requestAnimationFrame(() => sentinel.focus());
-    }
+    (isPrevious ? this.#entranceSentinel : this.#exitSentinel).focus();
   }
   #getFocusables() {
     return powerFocusable.getFocusables(this.#host, {
@@ -207,7 +180,7 @@ function containsComposed(container, element) {
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.2.27
+ * @version 1.2.28
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.d.cts

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

package/dist/index.d.ts

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

package/dist/index.js

@@ -1,5 +1,5 @@
 import { restoreAttributes, saveAttributes } from '@y14e/attributes-utils';
-import { focusElement, getNextFocusable, getPreviousFocusable, getActiveElement, getFocusables } from 'power-focusable';
+import { focusElement, getActiveElement, getFocusables, getPreviousFocusable, getNextFocusable } from 'power-focusable';
 
 // src/index.ts
 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;`;
@@ -29,7 +29,6 @@ var Portal = class {
   #exitSentinel;
   #focusables = /* @__PURE__ */ new Set();
   #controller = null;
-  #timer;
   #isDestroyed = false;
   constructor(host, container) {
     this.#host = host;
@@ -49,10 +48,6 @@ var Portal = class {
     this.#isDestroyed = true;
     this.#controller?.abort();
     this.#controller = null;
-    if (this.#timer !== void 0) {
-      cancelAnimationFrame(this.#timer);
-      this.#timer = void 0;
-    }
     restoreAttributes([...this.#focusables]);
     this.#focusables.clear();
     this.#exitSentinel.after(this.#host);
@@ -89,15 +84,7 @@ var Portal = class {
       }
       this.#update();
       const first = [...this.#focusables][0];
-      if (first) {
-        focusElement(first);
-      } else {
-        const next = getNextFocusable(document.body, {
-          anchor: this.#exitSentinel,
-          composed: true
-        });
-        next && focusElement(next);
-      }
+      first ? focusElement(first) : this.#moveFocus("next");
     } else {
       if (this.#host.contains(previous)) {
         this.#moveFocus("next");
@@ -105,15 +92,7 @@ var Portal = class {
       }
       this.#update();
       const last = [...this.#focusables].at(-1);
-      if (last) {
-        focusElement(last);
-      } else {
-        const previous2 = getPreviousFocusable(document.body, {
-          anchor: this.#entranceSentinel,
-          composed: true
-        });
-        previous2 && focusElement(previous2);
-      }
+      last ? focusElement(last) : this.#moveFocus("previous");
     }
   };
   #onKeyDown = (event) => {
@@ -167,13 +146,7 @@ var Portal = class {
     return sentinel;
   }
   #focusSentinel(isPrevious) {
-    const sentinel = isPrevious ? this.#entranceSentinel : this.#exitSentinel;
-    if (isPrevious) {
-      sentinel.focus();
-    } else {
-      this.#timer && cancelAnimationFrame(this.#timer);
-      this.#timer = requestAnimationFrame(() => sentinel.focus());
-    }
+    (isPrevious ? this.#entranceSentinel : this.#exitSentinel).focus();
   }
   #getFocusables() {
     return getFocusables(this.#host, {
@@ -205,7 +178,7 @@ function containsComposed(container, element) {
  * Lightweight DOM portal (teleport) utility with fully focus management.
  * Designed for accessible dialogs, menus, overlays, popovers.
  *
- * @version 1.2.27
+ * @version 1.2.28
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/package.json

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