inclusive-elements 0.5.0-beta.1 → 0.5.0-beta.3

package/dist/inclusive-elements10.js

@@ -1,7 +1,7 @@
 var l = Object.defineProperty;
-var u = (o, s, t) => s in o ? l(o, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[s] = t;
-var e = (o, s, t) => (u(o, typeof s != "symbol" ? s + "" : s, t), t);
-import { autoUpdate as p, computePosition as c, shift as m, flip as v } from "@floating-ui/dom";
+var p = (o, s, t) => s in o ? l(o, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[s] = t;
+var e = (o, s, t) => (p(o, typeof s != "symbol" ? s + "" : s, t), t);
+import { autoUpdate as u, computePosition as c, shift as v, flip as m } from "@floating-ui/dom";
 import { hello as b, goodbye as f } from "hello-goodbye";
 const n = class n extends HTMLElement {
   constructor() {
@@ -49,25 +49,25 @@ const n = class n extends HTMLElement {
     if (this.disabled)
       return;
     const t = this.createTooltip();
-    clearTimeout(this.timeout), this.showing || (t.hidden = !1, b(t), this.showing = !0), this.innerHTML !== this.prevInnerHTML && (this.prevInnerHTML = t.innerHTML = this.innerHTML), t.style.position = "absolute", (i = this.cleanup) == null || i.call(this), this.cleanup = p(
+    clearTimeout(this.timeout), this.showing || (t.hidden = !1, b(t), this.showing = !0), this.innerHTML !== this.prevInnerHTML && (this.prevInnerHTML = t.innerHTML = this.innerHTML), t.style.position = "absolute", (i = this.cleanup) == null || i.call(this), this.cleanup = u(
       this.parent,
       t,
       () => c(this.parent, t, {
         placement: this.getAttribute("placement") || n.placement,
-        middleware: [m(), v()]
-      }).then(({ x: h, y: a, placement: d }) => {
+        middleware: [v(), m()]
+      }).then(({ x: r, y: a, placement: d }) => {
         Object.assign(t.style, {
-          left: `${h}px`,
+          left: `${r}px`,
           top: `${a}px`
         }), t.dataset.placement = d;
       })
-    );
+    ), this.dispatchEvent(new Event("open"));
   }
   hide() {
     var t;
-    clearTimeout(this.timeout), (t = this.cleanup) == null || t.call(this), this.showing && (this.showing = !1, f(this.tooltip).then(() => {
+    clearTimeout(this.timeout), (t = this.cleanup) == null || t.call(this), this.showing && (this.showing = !1, this.tooltip && f(this.tooltip).then(() => {
       this.tooltip && (this.tooltip.hidden = !0);
-    }));
+    }), this.dispatchEvent(new Event("close")));
   }
   afterDelay(t) {
     clearTimeout(this.timeout);
@@ -78,14 +78,14 @@ const n = class n extends HTMLElement {
     );
   }
   createTooltip() {
-    return this.tooltip || (this.tooltip = document.createElement("div"), this.tooltip.className = this.getAttribute("tooltip-class") || n.tooltipClass, this.tooltip.hidden = !0, this.tooltip.addEventListener("mouseenter", this.show.bind(this)), this.tooltip.addEventListener(
+    return this.tooltip || (this.tooltip = document.createElement("div"), this.tooltip.hidden = !0, this.tooltip.addEventListener("mouseenter", this.show.bind(this)), this.tooltip.addEventListener(
       "mouseleave",
       this.afterDelay.bind(this, this.hide)
-    ), document.body.appendChild(this.tooltip)), this.tooltip;
+    ), document.body.appendChild(this.tooltip)), this.tooltip.className = this.getAttribute("tooltip-class") || n.tooltipClass, this.tooltip;
   }
 };
 e(n, "delay", 100), e(n, "placement", "top"), e(n, "tooltipClass", "tooltip");
-let r = n;
+let h = n;
 export {
-  r as default
+  h as default
 };

package/dist/inclusive-elements3.js

@@ -1,19 +1,11 @@
-var n = Object.defineProperty;
-var u = (a, s, t) => s in a ? n(a, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[s] = t;
-var o = (a, s, t) => (u(a, typeof s != "symbol" ? s + "" : s, t), t);
-const d = class d extends HTMLElement {
+var d = Object.defineProperty;
+var u = (e, s, t) => s in e ? d(e, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[s] = t;
+var o = (e, s, t) => (u(e, typeof s != "symbol" ? s + "" : s, t), t);
+const r = class r extends HTMLElement {
   constructor() {
-    super();
-    o(this, "added", /* @__PURE__ */ new Set());
+    super(...arguments);
     o(this, "timeouts", /* @__PURE__ */ new Map());
     o(this, "index", 0);
-    new MutationObserver((i) => {
-      i.forEach((r) => {
-        r.addedNodes.forEach((e) => {
-          e instanceof HTMLElement && !this.added.has(e) && this.show(e);
-        });
-      });
-    }).observe(this, { childList: !0 });
   }
   connectedCallback() {
     this.hasAttribute("role") || this.setAttribute("role", "status"), this.hasAttribute("aria-live") || this.setAttribute("aria-live", "polite"), this.hasAttribute("aria-relevant") || this.setAttribute("aria-relevant", "additions");
@@ -21,18 +13,18 @@ const d = class d extends HTMLElement {
       this.show(t);
   }
   show(t, i = {}) {
-    const r = i.key || t.dataset.key || String(this.index++);
-    this.dismiss(r), t.dataset.key = r, this.contains(t) || this.append(t), this.added.add(t);
-    const e = Number(
-      i.duration !== void 0 ? i.duration : t.dataset.duration || d.duration
+    const h = i.key || t.dataset.key || String(this.index++);
+    this.dismiss(h), t.dataset.key = h, this.contains(t) || this.append(t);
+    const a = Number(
+      i.duration !== void 0 ? i.duration : t.dataset.duration || r.duration
     );
-    return e > 0 && (this.startTimeout(t, e), t.addEventListener("mouseenter", this.clearTimeout.bind(this, t)), t.addEventListener("focusin", this.clearTimeout.bind(this, t)), t.addEventListener(
+    return a > 0 && (this.startTimeout(t, a), t.addEventListener("mouseenter", this.clearTimeout.bind(this, t)), t.addEventListener("focusin", this.clearTimeout.bind(this, t)), t.addEventListener(
       "mouseleave",
-      this.startTimeout.bind(this, t, e)
+      this.startTimeout.bind(this, t, a)
     ), t.addEventListener(
       "focusout",
-      this.startTimeout.bind(this, t, e)
-    )), r;
+      this.startTimeout.bind(this, t, a)
+    )), h;
   }
   dismiss(t) {
     if (typeof t == "string") {
@@ -41,7 +33,7 @@ const d = class d extends HTMLElement {
       ).forEach((i) => this.dismiss(i));
       return;
     }
-    this.added.delete(t), t.remove(), this.clearTimeout(t);
+    t.remove(), this.clearTimeout(t);
   }
   clear() {
     Array.from(this.children).forEach((t) => {
@@ -72,8 +64,8 @@ const d = class d extends HTMLElement {
     this.timeouts.has(t) && clearTimeout(this.timeouts.get(t));
   }
 };
-o(d, "duration", 1e4);
-let h = d;
+o(r, "duration", 1e4);
+let n = r;
 export {
-  h as default
+  n as default
 };

package/dist/inclusive-elements7.js

@@ -1,29 +1,31 @@
-var u = Object.defineProperty;
-var p = (r, n, t) => n in r ? u(r, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[n] = t;
-var s = (r, n, t) => (p(r, typeof n != "symbol" ? n + "" : n, t), t);
-import { autoUpdate as l, computePosition as f, shift as m, flip as b, size as k } from "@floating-ui/dom";
-import { cancel as a, hello as h, goodbye as c } from "hello-goodbye";
-import { focusable as g } from "tabbable";
-import { shouldOpenInNewTab as v } from "./inclusive-elements11.js";
-class A extends HTMLElement {
+var l = Object.defineProperty;
+var f = (a, s, t) => s in a ? l(a, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[s] = t;
+var h = (a, s, t) => (f(a, typeof s != "symbol" ? s + "" : s, t), t);
+import { autoUpdate as b, computePosition as m, shift as k, flip as g, size as v } from "@floating-ui/dom";
+import { cancel as u, hello as d, goodbye as p } from "hello-goodbye";
+import { focusable as w } from "tabbable";
+import { shouldOpenInNewTab as y } from "./inclusive-elements11.js";
+class D extends HTMLElement {
   constructor() {
     super();
-    s(this, "cleanup");
-    s(this, "onButtonClick", (t) => {
-      !v(t) && !this.disabled && (this.open = !this.open, t.preventDefault());
+    h(this, "cleanup");
+    h(this, "onButtonClick", (t) => {
+      !y(t) && !this.disabled && (this.open = !this.open, t.preventDefault());
     });
-    s(this, "onButtonKeyDown", (t) => {
+    h(this, "onButtonKeyDown", (t) => {
       var e;
-      t.key === "ArrowDown" && !this.disabled && (t.preventDefault(), this.open = !0, (e = g(this.content)[0]) == null || e.focus());
+      t.key === "ArrowDown" && !this.disabled && (t.preventDefault(), this.open = !0, this.content && ((e = w(this.content)[0]) == null || e.focus()));
     });
-    s(this, "onKeyDown", (t) => {
-      t.key === "Escape" && this.open && (t.preventDefault(), t.stopPropagation(), this.open = !1, this.button.focus());
+    h(this, "onKeyDown", (t) => {
+      var e;
+      t.key === "Escape" && this.open && (t.preventDefault(), t.stopPropagation(), this.open = !1, (e = this.button) == null || e.focus());
     });
-    s(this, "onFocusOut", (t) => {
-      (!(t.relatedTarget instanceof Node) || !this.contains(t.relatedTarget)) && (this.open = !1);
+    h(this, "onFocusOut", (t) => {
+      t.relatedTarget instanceof Node && !this.contains(t.relatedTarget) && (this.open = !1);
     });
-    s(this, "onContentClick", (t) => {
-      t.target instanceof Element && t.target.closest("[role=menuitem], [role=menuitemradio]") && (this.open = !1, this.button.focus());
+    h(this, "onContentClick", (t) => {
+      var e;
+      t.target instanceof Element && t.target.closest("[role=menuitem], [role=menuitemradio]") && (this.open = !1, (e = this.button) == null || e.focus(), t.stopPropagation());
     });
     const t = document.createElement("template");
     t.innerHTML = `
@@ -35,12 +37,18 @@ class A extends HTMLElement {
     return ["open"];
   }
   connectedCallback() {
-    this.backdrop.hidden = !0, this.content.hidden = !0, this.open = !1, this.button.setAttribute("aria-expanded", "false"), setTimeout(() => {
-      this.content.getAttribute("role") === "menu" && this.button.setAttribute("aria-haspopup", "true");
-    }), this.button.addEventListener("click", this.onButtonClick), this.button.addEventListener("keydown", this.onButtonKeyDown), this.addEventListener("keydown", this.onKeyDown), this.addEventListener("focusout", this.onFocusOut), this.content.addEventListener("click", this.onContentClick);
+    var t, e, n, o;
+    this.backdrop.hidden = !this.open, this.content && (this.content.hidden = !this.open), (t = this.button) == null || t.setAttribute(
+      "aria-expanded",
+      this.open ? "true" : "false"
+    ), setTimeout(() => {
+      var i, c;
+      ((i = this.content) == null ? void 0 : i.getAttribute("role")) === "menu" && ((c = this.button) == null || c.setAttribute("aria-haspopup", "true"));
+    }), (e = this.button) == null || e.addEventListener("click", this.onButtonClick), (n = this.button) == null || n.addEventListener("keydown", this.onButtonKeyDown), this.addEventListener("keydown", this.onKeyDown), this.addEventListener("focusout", this.onFocusOut), (o = this.content) == null || o.addEventListener("click", this.onContentClick);
   }
   disconnectedCallback() {
-    a(this.backdrop), a(this.content), this.button.removeAttribute("aria-expanded"), this.button.removeAttribute("aria-haspopup"), this.button.removeEventListener("click", this.onButtonClick), this.button.removeEventListener("keydown", this.onButtonKeyDown), this.removeEventListener("keydown", this.onKeyDown), this.removeEventListener("focusout", this.onFocusOut), this.content.removeEventListener("click", this.onContentClick);
+    var t, e, n, o, i;
+    u(this.backdrop), this.content && u(this.content), (t = this.button) == null || t.removeAttribute("aria-expanded"), (e = this.button) == null || e.removeAttribute("aria-haspopup"), (n = this.button) == null || n.removeEventListener("click", this.onButtonClick), (o = this.button) == null || o.removeEventListener("keydown", this.onButtonKeyDown), this.removeEventListener("keydown", this.onKeyDown), this.removeEventListener("focusout", this.onFocusOut), (i = this.content) == null || i.removeEventListener("click", this.onContentClick);
   }
   get open() {
     return this.hasAttribute("open");
@@ -51,52 +59,57 @@ class A extends HTMLElement {
   get disabled() {
     return this.hasAttribute("disabled");
   }
-  attributeChangedCallback(t, e, i) {
-    t === "open" && (i !== null ? this.wasOpened() : this.wasClosed());
+  attributeChangedCallback(t, e, n) {
+    t === "open" && (n !== null ? this.wasOpened() : this.wasClosed());
   }
   wasOpened() {
-    if (!this.content.hidden)
+    var e, n;
+    if (!((e = this.content) != null && e.hidden))
       return;
-    this.content.hidden = !1, this.content.style.position = "fixed", this.backdrop.hidden = !1, h(this.content), h(this.backdrop), this.button.setAttribute("aria-expanded", "true"), this.cleanup = l(
+    this.content.hidden = !1, this.content.style.position = "fixed", this.backdrop.hidden = !1, d(this.content), d(this.backdrop), (n = this.button) == null || n.setAttribute("aria-expanded", "true"), this.button && (this.cleanup = b(
       this.button,
       this.content,
       () => {
-        f(this.button, this.content, {
+        !this.button || !this.content || m(this.button, this.content, {
           strategy: "fixed",
           placement: this.getAttribute("placement") || "bottom",
           middleware: [
-            m(),
-            b(),
-            k({
+            k(),
+            g(),
+            v({
               apply: ({
-                availableWidth: e,
+                availableWidth: o,
                 availableHeight: i,
-                placement: d
+                placement: c
               }) => {
-                this.content.dataset.placement = d, Object.assign(this.content.style, {
+                if (!this.content)
+                  return;
+                this.content.dataset.placement = c, Object.assign(this.content.style, {
                   maxWidth: "",
                   maxHeight: ""
                 });
-                const o = getComputedStyle(this.content);
-                e -= parseInt(o.marginLeft) + parseInt(o.marginRight), (o.maxWidth === "none" || e < parseInt(o.maxWidth)) && (this.content.style.maxWidth = `${e}px`), i -= parseInt(o.marginTop) + parseInt(o.marginBottom), (o.maxHeight === "none" || i < parseInt(o.maxHeight)) && (this.content.style.maxHeight = `${i}px`);
+                const r = getComputedStyle(
+                  this.content
+                );
+                o -= parseInt(r.marginLeft) + parseInt(r.marginRight), (r.maxWidth === "none" || o < parseInt(r.maxWidth)) && (this.content.style.maxWidth = `${o}px`), i -= parseInt(r.marginTop) + parseInt(r.marginBottom), (r.maxHeight === "none" || i < parseInt(r.maxHeight)) && (this.content.style.maxHeight = `${i}px`);
               }
             })
           ]
-        }).then(({ x: e, y: i }) => {
-          Object.assign(this.content.style, {
-            left: `${e}px`,
+        }).then(({ x: o, y: i }) => {
+          this.content && Object.assign(this.content.style, {
+            left: `${o}px`,
             top: `${i}px`
           });
         });
       },
       { ancestorScroll: !1 }
-    );
+    ));
     const t = this.content.querySelector("[autofocus]");
     t ? t.focus() : this.content.focus(), this.dispatchEvent(new Event("open"));
   }
   wasClosed() {
-    var t;
-    this.content.hidden || (this.button.setAttribute("aria-expanded", "false"), (t = this.cleanup) == null || t.call(this), c(this.backdrop).then(() => this.backdrop.hidden = !0), c(this.content).then(() => this.content.hidden = !0), this.dispatchEvent(new Event("close")));
+    var t, e, n;
+    (t = this.content) != null && t.hidden || ((e = this.button) == null || e.setAttribute("aria-expanded", "false"), (n = this.cleanup) == null || n.call(this), p(this.backdrop).then(() => this.backdrop.hidden = !0), this.content && p(this.content).then(() => this.content.hidden = !0), this.dispatchEvent(new Event("close")));
   }
   get backdrop() {
     var t;
@@ -110,5 +123,5 @@ class A extends HTMLElement {
   }
 }
 export {
-  A as default
+  D as default
 };

package/dist/types/alerts/alerts.d.ts

@@ -4,10 +4,8 @@ export type AlertOptions = {
 };
 export default class AlertsElement extends HTMLElement {
     static duration: number;
-    private added;
     private timeouts;
     private index;
-    constructor();
     connectedCallback(): void;
     show(el: HTMLElement, options?: AlertOptions): string;
     dismiss(el: HTMLElement): void;

package/dist/types/tooltip/tooltip.d.ts

@@ -20,8 +20,8 @@ export default class TooltipElement extends HTMLElement {
     set disabled(val: boolean);
     private onKeyDown;
     private onKeyUp;
-    private show;
-    private hide;
+    show(): void;
+    hide(): void;
     private afterDelay;
     private createTooltip;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "inclusive-elements",
-    "version": "0.5.0-beta.1",
+    "version": "0.5.0-beta.3",
     "description": "Accessible, lightweight, unstyled implementations of common UI controls.",
     "module": "dist/inclusive-elements.js",
     "type": "module",
@@ -18,17 +18,17 @@
         "release": "release-it"
     },
     "dependencies": {
-        "@floating-ui/dom": "^1.5.3",
-        "focus-trap": "^7.5.3",
-        "hello-goodbye": "^0.2.1",
+        "@floating-ui/dom": "^1.7.4",
+        "focus-trap": "^7.6.5",
+        "hello-goodbye": "^0.2.2",
         "tabbable": "^6.2.0"
     },
     "devDependencies": {
         "@release-it/conventional-changelog": "^5.1.1",
         "prettier": "^2.8.8",
         "release-it": "^15.11.0",
-        "typescript": "^5.2.2",
-        "vite": "^4.4.11"
+        "typescript": "^5.9.2",
+        "vite": "^4.5.14"
     },
     "release-it": {
         "git": {
@@ -52,5 +52,6 @@
     },
     "prettier": {
         "singleQuote": true
-    }
+    },
+    "packageManager": "pnpm@10.17.1+sha512.17c560fca4867ae9473a3899ad84a88334914f379be46d455cbf92e5cf4b39d34985d452d2583baf19967fa76cb5c17bc9e245529d0b98745721aa7200ecaf7a"
 }