vanilla-drawers 1.0.1 → 1.0.3

package/README.md

@@ -1,19 +1,18 @@
-# drawers
-
-Окно открытое позже имеет больший zIndex чем окно открытое ранее
-
-Возможность задать фиксированный zIndex
-Возможность закрытия по нажатию Esc
-Возможность закрытия по нажатию вне тела окна, с опцией проверки объекта, но котором произошло нажатие, например, если в теле модалки было открыто стороннее диалоговое окно, то по нажатие внутри этого диалогового окна не закрывалось текущее.
-Возможность подтверждения закрытия через дополнительное диалоговое окно
-
-Набор встроенных диалоговых окон alert, confirm, prompt etc
-
-Поддержка создания группы окон:
-Назначение окну индекса внутри группы [data-drawer-id]
-Возможность переключаться между немодальными окнами в группе (изменение zIndex)
-Возможность вкладывать группу в группу
-
-
-Кто должен устанавливать класс блокировки основного скроллинга страницы?
-
+# drawers
+
+# ready
+* Окно открытое позже имеет больший zIndex чем окно открытое ранее
+* Возможность задать фиксированный zIndex
+* Возможность закрытия по нажатию Esc
+* Возможность закрытия по нажатию вне тела окна, с опцией проверки объекта, на котором произошло нажатие, например,если в теле модалки было открыто стороннее диалоговое окно, то по нажатие внутри этого диалогового окна не закрывалось текущее.
+* Возможность подтверждения закрытия.
+* Поддержка создания группы окон.
+* Каждая отедельная группа может установить блокировку скролла ближайшего к ней контейнера `[data-scrollable], html`
+
+# to do
+* Набор встроенных диалоговых окон alert, confirm, prompt etc
+* Назначение окну индекса внутри группы [data-drawer-id]
+* Возможность переключаться между немодальными окнами в группе (изменение zIndex)
+* Возможность вкладывать группу в группу
+* Если клик произошел внутри модального окна, то событие этого клика не должно закрывать другие окна
+(На данный момент собыьтя кдтка вгутри других окон игнорируются безусловно)

package/dist/drawers.es.js

@@ -1,220 +1,233 @@
-var F = (n, t, e) => {
-  if (!t.has(n))
+var Q = (r, t, e) => {
+  if (!t.has(r))
     throw TypeError("Cannot " + e);
 };
-var r = (n, t, e) => (F(n, t, "read from private field"), e ? e.call(n) : t.get(n)), y = (n, t, e) => {
-  if (t.has(n))
+var n = (r, t, e) => (Q(r, t, "read from private field"), e ? e.call(r) : t.get(r)), b = (r, t, e) => {
+  if (t.has(r))
     throw TypeError("Cannot add the same private member more than once");
-  t instanceof WeakSet ? t.add(n) : t.set(n, e);
-}, b = (n, t, e, a) => (F(n, t, "write to private field"), a ? a.call(n, e) : t.set(n, e), e);
-function Q(n) {
-  return n && n.__esModule && Object.prototype.hasOwnProperty.call(n, "default") ? n.default : n;
+  t instanceof WeakSet ? t.add(r) : t.set(r, e);
+}, m = (r, t, e, l) => (Q(r, t, "write to private field"), l ? l.call(r, e) : t.set(r, e), e);
+function te(r) {
+  return r && r.__esModule && Object.prototype.hasOwnProperty.call(r, "default") ? r.default : r;
 }
-var W = { exports: {} };
-(function(n) {
+var ne = { exports: {} };
+(function(r) {
   var t = Object.prototype.hasOwnProperty, e = "~";
-  function a() {
+  function l() {
   }
-  Object.create && (a.prototype = /* @__PURE__ */ Object.create(null), new a().__proto__ || (e = !1));
-  function s(u, o, i) {
-    this.fn = u, this.context = o, this.once = i || !1;
+  Object.create && (l.prototype = /* @__PURE__ */ Object.create(null), new l().__proto__ || (e = !1));
+  function s(h, i, o) {
+    this.fn = h, this.context = i, this.once = o || !1;
   }
-  function f(u, o, i, c, v) {
-    if (typeof i != "function")
+  function f(h, i, o, c, v) {
+    if (typeof o != "function")
       throw new TypeError("The listener must be a function");
-    var g = new s(i, c || u, v), d = e ? e + o : o;
-    return u._events[d] ? u._events[d].fn ? u._events[d] = [u._events[d], g] : u._events[d].push(g) : (u._events[d] = g, u._eventsCount++), u;
+    var g = new s(o, c || h, v), w = e ? e + i : i;
+    return h._events[w] ? h._events[w].fn ? h._events[w] = [h._events[w], g] : h._events[w].push(g) : (h._events[w] = g, h._eventsCount++), h;
   }
-  function h(u, o) {
-    --u._eventsCount === 0 ? u._events = new a() : delete u._events[o];
+  function d(h, i) {
+    --h._eventsCount === 0 ? h._events = new l() : delete h._events[i];
   }
-  function p() {
-    this._events = new a(), this._eventsCount = 0;
+  function u() {
+    this._events = new l(), this._eventsCount = 0;
   }
-  p.prototype.eventNames = function() {
-    var o = [], i, c;
+  u.prototype.eventNames = function() {
+    var i = [], o, c;
     if (this._eventsCount === 0)
-      return o;
-    for (c in i = this._events)
-      t.call(i, c) && o.push(e ? c.slice(1) : c);
-    return Object.getOwnPropertySymbols ? o.concat(Object.getOwnPropertySymbols(i)) : o;
-  }, p.prototype.listeners = function(o) {
-    var i = e ? e + o : o, c = this._events[i];
+      return i;
+    for (c in o = this._events)
+      t.call(o, c) && i.push(e ? c.slice(1) : c);
+    return Object.getOwnPropertySymbols ? i.concat(Object.getOwnPropertySymbols(o)) : i;
+  }, u.prototype.listeners = function(i) {
+    var o = e ? e + i : i, c = this._events[o];
     if (!c)
       return [];
     if (c.fn)
       return [c.fn];
-    for (var v = 0, g = c.length, d = new Array(g); v < g; v++)
-      d[v] = c[v].fn;
-    return d;
-  }, p.prototype.listenerCount = function(o) {
-    var i = e ? e + o : o, c = this._events[i];
+    for (var v = 0, g = c.length, w = new Array(g); v < g; v++)
+      w[v] = c[v].fn;
+    return w;
+  }, u.prototype.listenerCount = function(i) {
+    var o = e ? e + i : i, c = this._events[o];
     return c ? c.fn ? 1 : c.length : 0;
-  }, p.prototype.emit = function(o, i, c, v, g, d) {
-    var _ = e ? e + o : o;
-    if (!this._events[_])
+  }, u.prototype.emit = function(i, o, c, v, g, w) {
+    var j = e ? e + i : i;
+    if (!this._events[j])
       return !1;
-    var l = this._events[_], S = arguments.length, P, w;
-    if (l.fn) {
-      switch (l.once && this.removeListener(o, l.fn, void 0, !0), S) {
+    var a = this._events[j], S = arguments.length, k, y;
+    if (a.fn) {
+      switch (a.once && this.removeListener(i, a.fn, void 0, !0), S) {
         case 1:
-          return l.fn.call(l.context), !0;
+          return a.fn.call(a.context), !0;
         case 2:
-          return l.fn.call(l.context, i), !0;
+          return a.fn.call(a.context, o), !0;
         case 3:
-          return l.fn.call(l.context, i, c), !0;
+          return a.fn.call(a.context, o, c), !0;
         case 4:
-          return l.fn.call(l.context, i, c, v), !0;
+          return a.fn.call(a.context, o, c, v), !0;
         case 5:
-          return l.fn.call(l.context, i, c, v, g), !0;
+          return a.fn.call(a.context, o, c, v, g), !0;
         case 6:
-          return l.fn.call(l.context, i, c, v, g, d), !0;
+          return a.fn.call(a.context, o, c, v, g, w), !0;
       }
-      for (w = 1, P = new Array(S - 1); w < S; w++)
-        P[w - 1] = arguments[w];
-      l.fn.apply(l.context, P);
+      for (y = 1, k = new Array(S - 1); y < S; y++)
+        k[y - 1] = arguments[y];
+      a.fn.apply(a.context, k);
     } else {
-      var Z = l.length, k;
-      for (w = 0; w < Z; w++)
-        switch (l[w].once && this.removeListener(o, l[w].fn, void 0, !0), S) {
+      var se = a.length, I;
+      for (y = 0; y < se; y++)
+        switch (a[y].once && this.removeListener(i, a[y].fn, void 0, !0), S) {
           case 1:
-            l[w].fn.call(l[w].context);
+            a[y].fn.call(a[y].context);
             break;
           case 2:
-            l[w].fn.call(l[w].context, i);
+            a[y].fn.call(a[y].context, o);
             break;
           case 3:
-            l[w].fn.call(l[w].context, i, c);
+            a[y].fn.call(a[y].context, o, c);
             break;
           case 4:
-            l[w].fn.call(l[w].context, i, c, v);
+            a[y].fn.call(a[y].context, o, c, v);
             break;
           default:
-            if (!P)
-              for (k = 1, P = new Array(S - 1); k < S; k++)
-                P[k - 1] = arguments[k];
-            l[w].fn.apply(l[w].context, P);
+            if (!k)
+              for (I = 1, k = new Array(S - 1); I < S; I++)
+                k[I - 1] = arguments[I];
+            a[y].fn.apply(a[y].context, k);
         }
     }
     return !0;
-  }, p.prototype.on = function(o, i, c) {
-    return f(this, o, i, c, !1);
-  }, p.prototype.once = function(o, i, c) {
-    return f(this, o, i, c, !0);
-  }, p.prototype.removeListener = function(o, i, c, v) {
-    var g = e ? e + o : o;
+  }, u.prototype.on = function(i, o, c) {
+    return f(this, i, o, c, !1);
+  }, u.prototype.once = function(i, o, c) {
+    return f(this, i, o, c, !0);
+  }, u.prototype.removeListener = function(i, o, c, v) {
+    var g = e ? e + i : i;
     if (!this._events[g])
       return this;
-    if (!i)
-      return h(this, g), this;
-    var d = this._events[g];
-    if (d.fn)
-      d.fn === i && (!v || d.once) && (!c || d.context === c) && h(this, g);
+    if (!o)
+      return d(this, g), this;
+    var w = this._events[g];
+    if (w.fn)
+      w.fn === o && (!v || w.once) && (!c || w.context === c) && d(this, g);
     else {
-      for (var _ = 0, l = [], S = d.length; _ < S; _++)
-        (d[_].fn !== i || v && !d[_].once || c && d[_].context !== c) && l.push(d[_]);
-      l.length ? this._events[g] = l.length === 1 ? l[0] : l : h(this, g);
+      for (var j = 0, a = [], S = w.length; j < S; j++)
+        (w[j].fn !== o || v && !w[j].once || c && w[j].context !== c) && a.push(w[j]);
+      a.length ? this._events[g] = a.length === 1 ? a[0] : a : d(this, g);
     }
     return this;
-  }, p.prototype.removeAllListeners = function(o) {
-    var i;
-    return o ? (i = e ? e + o : o, this._events[i] && h(this, i)) : (this._events = new a(), this._eventsCount = 0), this;
-  }, p.prototype.off = p.prototype.removeListener, p.prototype.addListener = p.prototype.on, p.prefixed = e, p.EventEmitter = p, n.exports = p;
-})(W);
-var ee = W.exports;
-const te = /* @__PURE__ */ Q(ee);
-var ne = function(t) {
-  return re(t) && !se(t);
+  }, u.prototype.removeAllListeners = function(i) {
+    var o;
+    return i ? (o = e ? e + i : i, this._events[o] && d(this, o)) : (this._events = new l(), this._eventsCount = 0), this;
+  }, u.prototype.off = u.prototype.removeListener, u.prototype.addListener = u.prototype.on, u.prefixed = e, u.EventEmitter = u, r.exports = u;
+})(ne);
+var ie = ne.exports;
+const oe = /* @__PURE__ */ te(ie);
+var ae = function(t) {
+  return le(t) && !ce(t);
 };
-function re(n) {
-  return !!n && typeof n == "object";
+function le(r) {
+  return !!r && typeof r == "object";
 }
-function se(n) {
-  var t = Object.prototype.toString.call(n);
-  return t === "[object RegExp]" || t === "[object Date]" || le(n);
+function ce(r) {
+  var t = Object.prototype.toString.call(r);
+  return t === "[object RegExp]" || t === "[object Date]" || fe(r);
 }
-var oe = typeof Symbol == "function" && Symbol.for, ie = oe ? Symbol.for("react.element") : 60103;
-function le(n) {
-  return n.$$typeof === ie;
+var he = typeof Symbol == "function" && Symbol.for, ue = he ? Symbol.for("react.element") : 60103;
+function fe(r) {
+  return r.$$typeof === ue;
 }
-function ce(n) {
-  return Array.isArray(n) ? [] : {};
+function de(r) {
+  return Array.isArray(r) ? [] : {};
 }
-function z(n, t) {
-  return t.clone !== !1 && t.isMergeableObject(n) ? T(ce(n), n, t) : n;
+function U(r, t) {
+  return t.clone !== !1 && t.isMergeableObject(r) ? D(de(r), r, t) : r;
 }
-function ae(n, t, e) {
-  return n.concat(t).map(function(a) {
-    return z(a, e);
+function pe(r, t, e) {
+  return r.concat(t).map(function(l) {
+    return U(l, e);
   });
 }
-function ue(n, t) {
+function we(r, t) {
   if (!t.customMerge)
-    return T;
-  var e = t.customMerge(n);
-  return typeof e == "function" ? e : T;
+    return D;
+  var e = t.customMerge(r);
+  return typeof e == "function" ? e : D;
 }
-function fe(n) {
-  return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(n).filter(function(t) {
-    return Object.propertyIsEnumerable.call(n, t);
+function ye(r) {
+  return Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(r).filter(function(t) {
+    return Object.propertyIsEnumerable.call(r, t);
   }) : [];
 }
-function K(n) {
-  return Object.keys(n).concat(fe(n));
+function W(r) {
+  return Object.keys(r).concat(ye(r));
 }
-function X(n, t) {
+function re(r, t) {
   try {
-    return t in n;
+    return t in r;
   } catch {
     return !1;
   }
 }
-function he(n, t) {
-  return X(n, t) && !(Object.hasOwnProperty.call(n, t) && Object.propertyIsEnumerable.call(n, t));
+function be(r, t) {
+  return re(r, t) && !(Object.hasOwnProperty.call(r, t) && Object.propertyIsEnumerable.call(r, t));
 }
-function pe(n, t, e) {
-  var a = {};
-  return e.isMergeableObject(n) && K(n).forEach(function(s) {
-    a[s] = z(n[s], e);
-  }), K(t).forEach(function(s) {
-    he(n, s) || (X(n, s) && e.isMergeableObject(t[s]) ? a[s] = ue(s, e)(n[s], t[s], e) : a[s] = z(t[s], e));
-  }), a;
+function me(r, t, e) {
+  var l = {};
+  return e.isMergeableObject(r) && W(r).forEach(function(s) {
+    l[s] = U(r[s], e);
+  }), W(t).forEach(function(s) {
+    be(r, s) || (re(r, s) && e.isMergeableObject(t[s]) ? l[s] = we(s, e)(r[s], t[s], e) : l[s] = U(t[s], e));
+  }), l;
 }
-function T(n, t, e) {
-  e = e || {}, e.arrayMerge = e.arrayMerge || ae, e.isMergeableObject = e.isMergeableObject || ne, e.cloneUnlessOtherwiseSpecified = z;
-  var a = Array.isArray(t), s = Array.isArray(n), f = a === s;
-  return f ? a ? e.arrayMerge(n, t, e) : pe(n, t, e) : z(t, e);
+function D(r, t, e) {
+  e = e || {}, e.arrayMerge = e.arrayMerge || pe, e.isMergeableObject = e.isMergeableObject || ae, e.cloneUnlessOtherwiseSpecified = U;
+  var l = Array.isArray(t), s = Array.isArray(r), f = l === s;
+  return f ? l ? e.arrayMerge(r, t, e) : me(r, t, e) : U(t, e);
 }
-T.all = function(t, e) {
+D.all = function(t, e) {
   if (!Array.isArray(t))
     throw new Error("first argument should be an array");
-  return t.reduce(function(a, s) {
-    return T(a, s, e);
+  return t.reduce(function(l, s) {
+    return D(l, s, e);
   }, {});
 };
-var de = T, we = de;
-const ye = /* @__PURE__ */ Q(we);
+var ge = D, Oe = ge;
+const ve = /* @__PURE__ */ te(Oe);
 /*!
  * is-plain-object <https://github.com/jonschlinkert/is-plain-object>
  *
  * Copyright (c) 2014-2017, Jon Schlinkert.
  * Released under the MIT License.
  */
-function V(n) {
-  return Object.prototype.toString.call(n) === "[object Object]";
+function X(r) {
+  return Object.prototype.toString.call(r) === "[object Object]";
 }
-function ge(n) {
+function Ae(r) {
   var t, e;
-  return V(n) === !1 ? !1 : (t = n.constructor, t === void 0 ? !0 : (e = t.prototype, !(V(e) === !1 || e.hasOwnProperty("isPrototypeOf") === !1)));
+  return X(r) === !1 ? !1 : (t = r.constructor, t === void 0 ? !0 : (e = t.prototype, !(X(e) === !1 || e.hasOwnProperty("isPrototypeOf") === !1)));
 }
-function H(n) {
-  return n instanceof Element ? n : document.querySelector(n);
+function J(r) {
+  return r instanceof Element ? r : document.querySelector(r);
 }
-async function Y(n) {
-  return await new Promise((t) => setTimeout(t, n));
+async function H(r) {
+  return await new Promise((t) => setTimeout(t, r));
 }
-const be = '[data-elem="drawer.panel"]', $ = "data-drawers-group", J = {
+const Ee = '[data-elem="drawer.panel"]', $ = "data-drawers-group", Ce = [
+  "a[href]",
+  "area[href]",
+  'input:not([disabled]):not([type="hidden"]):not([aria-hidden])',
+  "select:not([disabled]):not([aria-hidden])",
+  "textarea:not([disabled]):not([aria-hidden])",
+  "button:not([disabled]):not([aria-hidden])",
+  "iframe",
+  "object",
+  "embed",
+  "[contenteditable]",
+  '[tabindex]:not([tabindex^="-"])'
+], Z = {
   modal: !0,
+  focusOnChild: !0,
   closeOnEsc: !0,
   closeOnOutsideClick: !0,
   closeOnUnderlayClick: !0,
@@ -230,175 +243,223 @@ const be = '[data-elem="drawer.panel"]', $ = "data-drawers-group", J = {
   closeAnimationDuration: 0,
   lockPageScroll: !0
 };
-var C, O, x, N;
-class G {
-  constructor({ target: t, type: e, owner: a }) {
-    y(this, C, void 0);
-    y(this, O, void 0);
-    y(this, x, void 0);
-    y(this, N, !1);
-    const s = H(t);
+function ee(r) {
+  return ve.all(r, {
+    isMergeableObject: Ae
+  });
+}
+var E, A, P, N;
+class V {
+  constructor({ target: t, type: e, owner: l }) {
+    b(this, E, void 0);
+    b(this, A, void 0);
+    b(this, P, void 0);
+    b(this, N, !1);
+    const s = J(t);
     if (!s)
       throw new Error("Trigger element cannot be found");
-    b(this, C, s), b(this, O, a), b(this, x, e), this.init();
+    m(this, E, s), m(this, A, l), m(this, P, e), this.init();
   }
   // Accessors
   get isActive() {
-    return r(this, N);
+    return n(this, N);
+  }
+  get owner() {
+    return n(this, A);
   }
   // Methods
   init() {
-    r(this, C).addEventListener("click", (t) => this.clickHandler(t)), r(this, O).on("open", () => this.setActive(!0)), r(this, O).on("close", () => this.setActive(!1));
+    n(this, E).addEventListener("click", (t) => this.clickHandler(t)), n(this, A).on("open", () => this.setActive(!0)), n(this, A).on("close", () => this.setActive(!1));
   }
   clickHandler(t) {
-    r(this, x) === "open" || r(this, x) === "toggle" ? r(this, O).isOpen || r(this, O).open(r(this, C)) : (r(this, x) === "close" || r(this, x) === "toggle") && r(this, O).isOpen && r(this, O).close(r(this, C));
+    t.__drawerTrigger = this, n(this, P) === "open" ? n(this, A).isOpen || n(this, A).open(n(this, E)) : n(this, P) === "close" ? n(this, A).isOpen && n(this, A).close(n(this, E)) : n(this, A).isOpen ? n(this, A).close(n(this, E)) : n(this, A).open(n(this, E));
   }
   setActive(t) {
-    b(this, N, t), t ? r(this, C).classList.add("drawer-trigger_active") : r(this, C).classList.remove("drawer-trigger_active");
+    m(this, N, t), t ? n(this, E).classList.add("drawer-trigger_active") : n(this, E).classList.remove("drawer-trigger_active");
   }
 }
-C = new WeakMap(), O = new WeakMap(), x = new WeakMap(), N = new WeakMap();
-var m, U, M, D;
-class me extends te {
-  constructor({ target: e, options: a }) {
+E = new WeakMap(), A = new WeakMap(), P = new WeakMap(), N = new WeakMap();
+var p, q, O, x, F, R;
+class _e extends oe {
+  constructor({ target: e, options: l }) {
     super();
-    y(this, m, void 0);
-    y(this, U, void 0);
-    y(this, M, void 0);
-    y(this, D, void 0);
-    b(this, m, ye.all(a ? [{}, J, a] : [{}, J], {
-      isMergeableObject: ge
-    }));
-    const s = H(e);
-    if (s === null)
-      throw new Error("Drawer's root cannot be found");
-    const f = s.querySelector(be);
+    b(this, p, void 0);
+    b(this, q, void 0);
+    b(this, O, void 0);
+    b(this, x, void 0);
+    b(this, F, void 0);
+    b(this, R, void 0);
+    this.handleDocumentClick = async (u) => {
+      var o;
+      if (((o = u.__drawerTrigger) == null ? void 0 : o.owner) === this)
+        return;
+      const h = u.target;
+      if (u.composedPath(), n(this, O).panel.contains(h))
+        return;
+      const i = h == null ? void 0 : h.closest("[data-drawer]");
+      i ? i.getAttribute("data-drawer") === n(this, R) ? this.handleUnderlayClick(u) : this.handleOtherDrawerClick(u) : this.handleOutsideClick(u);
+    }, this.handleKeydown = (u) => {
+      n(this, p).closeOnEsc && u.key === "Escape" && this.close();
+    };
+    const s = ee(l ? [Z, l] : [Z]), f = J(e);
     if (f === null)
+      throw new Error("Drawer's root cannot be found");
+    const d = f.querySelector(Ee);
+    if (d === null)
       throw new Error("Drawer's panel cannot be found");
-    b(this, M, {
-      root: s,
-      panel: f
-    }), r(this, M).root.classList.add("drawer_initialized");
+    m(this, O, {
+      root: f,
+      panel: d
+    }), m(this, R, f.getAttribute("data-drawer")), this.setOptions(s), n(this, O).panel.setAttribute("tabindex", "-1"), n(this, O).root.classList.add("drawer_initialized");
+  }
+  addEventListeners() {
+    n(this, O).root.addEventListener("keydown", this.handleKeydown), document.addEventListener("click", this.handleDocumentClick);
+  }
+  removeEventListeners() {
+    n(this, O).root.removeEventListener("keydown", this.handleKeydown), document.removeEventListener("click", this.handleDocumentClick);
   }
   // Accessors
   get isOpen() {
-    return r(this, D);
+    return n(this, x);
   }
   get isModal() {
-    return r(this, m).modal;
+    return n(this, p).modal;
+  }
+  set isModal(e) {
+    n(this, O).root.classList[e ? "add" : "remove"]("drawer_modal");
   }
   set zIndex(e) {
-    r(this, M).root.style.setProperty("--z-index", String(e)), b(this, U, e);
+    n(this, O).root.style.setProperty("--z-index", String(e)), m(this, q, e);
   }
   get zIndex() {
-    return r(this, U);
+    return n(this, q);
   }
   // Methods
   async open(e) {
-    r(this, D) || (this.emit("beforeOpen", { drawer: this, trigger: e }), b(this, D, !0), r(this, M).root.classList.add(r(this, m).openClass), this.emit("open", { drawer: this, trigger: e }), typeof r(this, m).openAnimationDuration == "number" && Y(r(this, m).openAnimationDuration), this.emit("openAnimationEnd", { drawer: this, trigger: e }));
+    H(1), !n(this, x) && (this.emit("beforeOpen", { drawer: this, trigger: e }), m(this, x, !0), n(this, O).root.classList.add(n(this, p).openClass), this.emit("open", { drawer: this, trigger: e }), typeof n(this, p).openAnimationDuration == "number" && H(n(this, p).openAnimationDuration), this.emit("openAnimationEnd", { drawer: this, trigger: e }), this.focus(), this.addEventListeners());
   }
   async close(e) {
-    r(this, m).onCloseConfirm && !r(this, m).onCloseConfirm(this, e) || (this.emit("beforeClose", { drawer: this, trigger: e }), b(this, D, !1), r(this, M).root.classList.remove(r(this, m).openClass), this.emit("close", { drawer: this, trigger: e }), typeof r(this, m).closeAnimationDuration == "number" && Y(r(this, m).closeAnimationDuration), this.emit("closeAnimationEnd", { drawer: this, trigger: e }));
+    n(this, p).onCloseConfirm && !n(this, p).onCloseConfirm(this, e) || (this.emit("beforeClose", { drawer: this, trigger: e }), this.removeEventListeners(), m(this, x, !1), n(this, O).root.classList.remove(n(this, p).openClass), this.emit("close", { drawer: this, trigger: e }), typeof n(this, p).closeAnimationDuration == "number" && H(n(this, p).closeAnimationDuration), this.emit("closeAnimationEnd", { drawer: this, trigger: e }));
   }
-  handleEsc(e) {
-    r(this, m).closeOnEsc && this.close();
+  handleOtherDrawerClick(e) {
   }
   handleOutsideClick(e) {
-    r(this, m).closeOnOutsideClick && this.close();
+    n(this, p).closeOnOutsideClick && (typeof n(this, p).closeOnOutsideClick == "object" && n(this, p).closeOnOutsideClick.hasOwnProperty("checkTarget") ? n(this, p).closeOnOutsideClick.checkTarget(e.target) && this.close() : this.close());
   }
   handleUnderlayClick(e) {
-    r(this, m).closeOnOutsideClick && this.close();
+    n(this, p).closeOnOutsideClick && this.close();
+  }
+  focus() {
+    n(this, p).focusOnChild && this.focusChild() || this.focusSelf();
+  }
+  focusSelf() {
+    n(this, O).panel.focus();
+  }
+  focusChild() {
+    const e = n(this, O).panel.querySelector(Ce.join(","));
+    return e ? (e.focus(), !0) : !1;
+  }
+  setOptions(e) {
+    var l;
+    e.hasOwnProperty("modal") && ((l = n(this, p)) == null ? void 0 : l.modal) !== e.modal && (this.isModal = e.modal), m(this, p, n(this, p) ? ee([n(this, p), e]) : e);
+  }
+  assignGroup(e) {
+    m(this, F, e);
   }
 }
-m = new WeakMap(), U = new WeakMap(), M = new WeakMap(), D = new WeakMap();
-var R, A, E, I, j, L;
-class ve {
+p = new WeakMap(), q = new WeakMap(), O = new WeakMap(), x = new WeakMap(), F = new WeakMap(), R = new WeakMap();
+var B, C, _, T, L, M;
+class je {
   constructor(t) {
-    y(this, R, void 0);
-    y(this, A, void 0);
-    y(this, E, void 0);
-    y(this, I, void 0);
-    y(this, j, void 0);
-    y(this, L, void 0);
-    b(this, A, []), b(this, E, []), b(this, j, /* @__PURE__ */ new Set()), b(this, L, /* @__PURE__ */ new Map()), this.onBeforeOpen = ({ drawer: s, trigger: f }) => {
-      s.isModal ? (r(this, L).set(s, r(this, A).length), r(this, A).push(s), s.zIndex = r(this, E).length + r(this, A).length) : (r(this, L).set(s, r(this, E).length), r(this, E).push(s), s.zIndex = r(this, E).length, r(this, A).length > 0 && r(this, A).forEach((h, p) => h.zIndex = r(this, E).length + p + 1)), this.lockScroll(s);
+    b(this, B, void 0);
+    b(this, C, void 0);
+    b(this, _, void 0);
+    b(this, T, void 0);
+    b(this, L, void 0);
+    b(this, M, void 0);
+    m(this, C, []), m(this, _, []), m(this, L, /* @__PURE__ */ new Set()), m(this, M, /* @__PURE__ */ new Map()), this.onBeforeOpen = ({ drawer: s, trigger: f }) => {
+      s.isModal ? (n(this, M).set(s, n(this, C).length), n(this, C).push(s), s.zIndex = n(this, _).length + n(this, C).length) : (n(this, M).set(s, n(this, _).length), n(this, _).push(s), s.zIndex = n(this, _).length, n(this, C).length > 0 && n(this, C).forEach((d, u) => d.zIndex = n(this, _).length + u + 1)), this.lockScroll(s);
     }, this.onCloseAnimationEnd = ({ drawer: s, trigger: f }) => {
-      const h = s.isModal ? r(this, A) : r(this, E);
-      for (delete h[r(this, L).get(s)]; h.length && !h.at(-1); )
-        h.pop();
-      r(this, L).delete(s), this.unlockScroll(s);
+      const d = s.isModal ? n(this, C) : n(this, _);
+      for (delete d[n(this, M).get(s)]; d.length && !d.at(-1); )
+        d.pop();
+      n(this, M).delete(s), this.unlockScroll(s);
     };
-    const e = H(t);
+    const e = J(t);
     if (e === null)
       throw new Error("Drawer's group root cannot be found");
-    b(this, R, e);
-    const a = r(this, R).closest("[data-scrollable], html");
-    if (a === null)
+    m(this, B, e);
+    const l = n(this, B).closest("[data-scrollable], html");
+    if (l === null)
       throw new Error("Scrollable container for group root cannot be found");
-    b(this, I, a);
+    m(this, T, l);
   }
   add(t) {
-    t.on("beforeOpen", this.onBeforeOpen), t.on("closeAnimationEnd", this.onCloseAnimationEnd);
+    t.on("beforeOpen", this.onBeforeOpen), t.on("closeAnimationEnd", this.onCloseAnimationEnd), t.assignGroup(this);
   }
   lockScroll(t) {
-    r(this, j).size === 0 && r(this, I).classList.add("scroll-lock-by-drawer"), r(this, j).add(t);
+    n(this, L).size === 0 && n(this, T).classList.add("scroll-lock-by-drawer"), n(this, L).add(t);
   }
   unlockScroll(t) {
-    console.log(r(this, j)), r(this, j).delete(t), r(this, j).size === 0 && r(this, I).classList.remove("scroll-lock-by-drawer");
+    n(this, L).delete(t), n(this, L).size === 0 && n(this, T).classList.remove("scroll-lock-by-drawer");
   }
 }
-R = new WeakMap(), A = new WeakMap(), E = new WeakMap(), I = new WeakMap(), j = new WeakMap(), L = new WeakMap();
-var q, B;
-class Oe {
+B = new WeakMap(), C = new WeakMap(), _ = new WeakMap(), T = new WeakMap(), L = new WeakMap(), M = new WeakMap();
+var G, K;
+const z = class z {
   constructor() {
-    y(this, q, /* @__PURE__ */ new Map());
-    y(this, B, /* @__PURE__ */ new Map());
+    b(this, G, /* @__PURE__ */ new Map());
+    b(this, K, /* @__PURE__ */ new Map());
+    if (z.instance)
+      return z.instance;
+    z.instance = this;
   }
   init(t) {
     document.querySelectorAll(`[${$}]`).forEach((f) => {
-      const h = f.getAttribute($);
-      typeof h == "string" && r(this, B).set(h, new ve(f));
+      const d = f.getAttribute($);
+      typeof d == "string" && n(this, K).set(d, new je(f));
     }), document.querySelectorAll("[data-drawer]").forEach((f) => {
-      var i;
-      const h = f.getAttribute("data-drawer");
-      if (typeof h != "string")
+      var o;
+      const d = f.getAttribute("data-drawer");
+      if (typeof d != "string")
         return;
-      const p = new me({ target: f, options: t });
-      r(this, q).set(h, p);
-      const u = f.closest(`[${$}]`), o = u == null ? void 0 : u.getAttribute($);
-      if (typeof o != "string")
+      const u = new _e({ target: f, options: t });
+      n(this, G).set(d, u);
+      const h = f.closest(`[${$}]`), i = h == null ? void 0 : h.getAttribute($);
+      if (typeof i != "string")
         throw new Error("Group doesn't have alias set correctly");
-      (i = r(this, B).get(o)) == null || i.add(p);
+      (o = n(this, K).get(i)) == null || o.add(u);
     }), document.querySelectorAll("[data-drawer-open], [data-drawer-close], [data-drawer-toggle]").forEach((f) => {
       if (f.hasAttribute("data-drawer-open")) {
-        const h = f.getAttribute("data-drawer-open");
-        new G({ target: f, type: "open", owner: this.get(h) });
+        const d = f.getAttribute("data-drawer-open");
+        new V({ target: f, type: "open", owner: this.get(d) });
       } else if (f.hasAttribute("data-drawer-close")) {
-        const h = f.getAttribute("data-drawer-close");
-        new G({ target: f, type: "close", owner: this.get(h) });
+        const d = f.getAttribute("data-drawer-close");
+        new V({ target: f, type: "close", owner: this.get(d) });
       } else {
-        const h = f.getAttribute("data-drawer-toggle");
-        new G({ target: f, type: "toggle", owner: this.get(h) });
+        const d = f.getAttribute("data-drawer-toggle");
+        new V({ target: f, type: "toggle", owner: this.get(d) });
       }
     });
   }
-  open(t, { trigger: e, options: a } = {}) {
+  open(t, { trigger: e, options: l } = {}) {
     var s;
     (s = this.get(t)) == null || s.open(e);
   }
-  close(t, { trigger: e, options: a } = {}) {
+  close(t, { trigger: e, options: l } = {}) {
     var s;
     (s = this.get(t)) == null || s.close(e);
   }
   get(t) {
-    return r(this, q).get(t);
+    return typeof t == "string" && n(this, G).get(t) || null;
   }
-}
-q = new WeakMap(), B = new WeakMap();
-typeof window < "u" && (window.hasOwnProperty("app") || (window.app = {}), window.app.drawers = new Oe());
+};
+G = new WeakMap(), K = new WeakMap();
+let Y = z;
+typeof window < "u" && (window.hasOwnProperty("app") || (window.app = {}), window.app.drawers = new Y());
 export {
-  me as Drawer,
-  ve as DrawersGroup,
-  G as Trigger,
-  Oe as default
+  _e as Drawer,
+  je as DrawersGroup,
+  V as Trigger,
+  Y as default
 };

package/dist/drawers.umd.js

@@ -1,6 +1,6 @@
-(function(h,g){typeof exports=="object"&&typeof module<"u"?g(exports):typeof define=="function"&&define.amd?define(["exports"],g):(h=typeof globalThis<"u"?globalThis:h||self,g(h.Drawers={}))})(this,function(h){"use strict";var re=(h,g,E)=>{if(!g.has(h))throw TypeError("Cannot "+E)};var r=(h,g,E)=>(re(h,g,"read from private field"),E?E.call(h):g.get(h)),b=(h,g,E)=>{if(g.has(h))throw TypeError("Cannot add the same private member more than once");g instanceof WeakSet?g.add(h):g.set(h,E)},O=(h,g,E,F)=>(re(h,g,"write to private field"),F?F.call(h,E):g.set(h,E),E);var S,_,L,R,m,q,P,I,B,C,j,N,M,T,G,$;function g(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var E={exports:{}};(function(n){var t=Object.prototype.hasOwnProperty,e="~";function a(){}Object.create&&(a.prototype=Object.create(null),new a().__proto__||(e=!1));function s(u,o,i){this.fn=u,this.context=o,this.once=i||!1}function f(u,o,i,c,A){if(typeof i!="function")throw new TypeError("The listener must be a function");var v=new s(i,c||u,A),w=e?e+o:o;return u._events[w]?u._events[w].fn?u._events[w]=[u._events[w],v]:u._events[w].push(v):(u._events[w]=v,u._eventsCount++),u}function d(u,o){--u._eventsCount===0?u._events=new a:delete u._events[o]}function p(){this._events=new a,this._eventsCount=0}p.prototype.eventNames=function(){var o=[],i,c;if(this._eventsCount===0)return o;for(c in i=this._events)t.call(i,c)&&o.push(e?c.slice(1):c);return Object.getOwnPropertySymbols?o.concat(Object.getOwnPropertySymbols(i)):o},p.prototype.listeners=function(o){var i=e?e+o:o,c=this._events[i];if(!c)return[];if(c.fn)return[c.fn];for(var A=0,v=c.length,w=new Array(v);A<v;A++)w[A]=c[A].fn;return w},p.prototype.listenerCount=function(o){var i=e?e+o:o,c=this._events[i];return c?c.fn?1:c.length:0},p.prototype.emit=function(o,i,c,A,v,w){var x=e?e+o:o;if(!this._events[x])return!1;var l=this._events[x],D=arguments.length,k,y;if(l.fn){switch(l.once&&this.removeListener(o,l.fn,void 0,!0),D){case 1:return l.fn.call(l.context),!0;case 2:return l.fn.call(l.context,i),!0;case 3:return l.fn.call(l.context,i,c),!0;case 4:return l.fn.call(l.context,i,c,A),!0;case 5:return l.fn.call(l.context,i,c,A,v),!0;case 6:return l.fn.call(l.context,i,c,A,v,w),!0}for(y=1,k=new Array(D-1);y<D;y++)k[y-1]=arguments[y];l.fn.apply(l.context,k)}else{var Ae=l.length,H;for(y=0;y<Ae;y++)switch(l[y].once&&this.removeListener(o,l[y].fn,void 0,!0),D){case 1:l[y].fn.call(l[y].context);break;case 2:l[y].fn.call(l[y].context,i);break;case 3:l[y].fn.call(l[y].context,i,c);break;case 4:l[y].fn.call(l[y].context,i,c,A);break;default:if(!k)for(H=1,k=new Array(D-1);H<D;H++)k[H-1]=arguments[H];l[y].fn.apply(l[y].context,k)}}return!0},p.prototype.on=function(o,i,c){return f(this,o,i,c,!1)},p.prototype.once=function(o,i,c){return f(this,o,i,c,!0)},p.prototype.removeListener=function(o,i,c,A){var v=e?e+o:o;if(!this._events[v])return this;if(!i)return d(this,v),this;var w=this._events[v];if(w.fn)w.fn===i&&(!A||w.once)&&(!c||w.context===c)&&d(this,v);else{for(var x=0,l=[],D=w.length;x<D;x++)(w[x].fn!==i||A&&!w[x].once||c&&w[x].context!==c)&&l.push(w[x]);l.length?this._events[v]=l.length===1?l[0]:l:d(this,v)}return this},p.prototype.removeAllListeners=function(o){var i;return o?(i=e?e+o:o,this._events[i]&&d(this,i)):(this._events=new a,this._eventsCount=0),this},p.prototype.off=p.prototype.removeListener,p.prototype.addListener=p.prototype.on,p.prefixed=e,p.EventEmitter=p,n.exports=p})(E);var F=E.exports;const se=g(F);var oe=function(t){return ie(t)&&!le(t)};function ie(n){return!!n&&typeof n=="object"}function le(n){var t=Object.prototype.toString.call(n);return t==="[object RegExp]"||t==="[object Date]"||ue(n)}var ce=typeof Symbol=="function"&&Symbol.for,ae=ce?Symbol.for("react.element"):60103;function ue(n){return n.$$typeof===ae}function fe(n){return Array.isArray(n)?[]:{}}function U(n,t){return t.clone!==!1&&t.isMergeableObject(n)?z(fe(n),n,t):n}function he(n,t,e){return n.concat(t).map(function(a){return U(a,e)})}function de(n,t){if(!t.customMerge)return z;var e=t.customMerge(n);return typeof e=="function"?e:z}function pe(n){return Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(n).filter(function(t){return Object.propertyIsEnumerable.call(n,t)}):[]}function J(n){return Object.keys(n).concat(pe(n))}function Q(n,t){try{return t in n}catch{return!1}}function we(n,t){return Q(n,t)&&!(Object.hasOwnProperty.call(n,t)&&Object.propertyIsEnumerable.call(n,t))}function ye(n,t,e){var a={};return e.isMergeableObject(n)&&J(n).forEach(function(s){a[s]=U(n[s],e)}),J(t).forEach(function(s){we(n,s)||(Q(n,s)&&e.isMergeableObject(t[s])?a[s]=de(s,e)(n[s],t[s],e):a[s]=U(t[s],e))}),a}function z(n,t,e){e=e||{},e.arrayMerge=e.arrayMerge||he,e.isMergeableObject=e.isMergeableObject||oe,e.cloneUnlessOtherwiseSpecified=U;var a=Array.isArray(t),s=Array.isArray(n),f=a===s;return f?a?e.arrayMerge(n,t,e):ye(n,t,e):U(t,e)}z.all=function(t,e){if(!Array.isArray(t))throw new Error("first argument should be an array");return t.reduce(function(a,s){return z(a,s,e)},{})};var ge=z,be=ge;const me=g(be);/*!
+(function(p,m){typeof exports=="object"&&typeof module<"u"?m(exports):typeof define=="function"&&define.amd?define(["exports"],m):(p=typeof globalThis<"u"?globalThis:p||self,m(p.Drawers={}))})(this,function(p){"use strict";var le=(p,m,_)=>{if(!m.has(p))throw TypeError("Cannot "+_)};var t=(p,m,_)=>(le(p,m,"read from private field"),_?_.call(p):m.get(p)),g=(p,m,_)=>{if(m.has(p))throw TypeError("Cannot add the same private member more than once");m instanceof WeakSet?m.add(p):m.set(p,_)},O=(p,m,_,V)=>(le(p,m,"write to private field"),V?V.call(p,_):m.set(p,_),_);var j,E,z,q,w,G,A,P,W,R,B,S,L,U,k,x,K,$;function m(r){return r&&r.__esModule&&Object.prototype.hasOwnProperty.call(r,"default")?r.default:r}var _={exports:{}};(function(r){var n=Object.prototype.hasOwnProperty,e="~";function u(){}Object.create&&(u.prototype=Object.create(null),new u().__proto__||(e=!1));function s(c,i,o){this.fn=c,this.context=i,this.once=o||!1}function f(c,i,o,a,C){if(typeof o!="function")throw new TypeError("The listener must be a function");var v=new s(o,a||c,C),y=e?e+i:i;return c._events[y]?c._events[y].fn?c._events[y]=[c._events[y],v]:c._events[y].push(v):(c._events[y]=v,c._eventsCount++),c}function d(c,i){--c._eventsCount===0?c._events=new u:delete c._events[i]}function h(){this._events=new u,this._eventsCount=0}h.prototype.eventNames=function(){var i=[],o,a;if(this._eventsCount===0)return i;for(a in o=this._events)n.call(o,a)&&i.push(e?a.slice(1):a);return Object.getOwnPropertySymbols?i.concat(Object.getOwnPropertySymbols(o)):i},h.prototype.listeners=function(i){var o=e?e+i:i,a=this._events[o];if(!a)return[];if(a.fn)return[a.fn];for(var C=0,v=a.length,y=new Array(v);C<v;C++)y[C]=a[C].fn;return y},h.prototype.listenerCount=function(i){var o=e?e+i:i,a=this._events[o];return a?a.fn?1:a.length:0},h.prototype.emit=function(i,o,a,C,v,y){var M=e?e+i:i;if(!this._events[M])return!1;var l=this._events[M],T=arguments.length,D,b;if(l.fn){switch(l.once&&this.removeListener(i,l.fn,void 0,!0),T){case 1:return l.fn.call(l.context),!0;case 2:return l.fn.call(l.context,o),!0;case 3:return l.fn.call(l.context,o,a),!0;case 4:return l.fn.call(l.context,o,a,C),!0;case 5:return l.fn.call(l.context,o,a,C,v),!0;case 6:return l.fn.call(l.context,o,a,C,v,y),!0}for(b=1,D=new Array(T-1);b<T;b++)D[b-1]=arguments[b];l.fn.apply(l.context,D)}else{var Se=l.length,H;for(b=0;b<Se;b++)switch(l[b].once&&this.removeListener(i,l[b].fn,void 0,!0),T){case 1:l[b].fn.call(l[b].context);break;case 2:l[b].fn.call(l[b].context,o);break;case 3:l[b].fn.call(l[b].context,o,a);break;case 4:l[b].fn.call(l[b].context,o,a,C);break;default:if(!D)for(H=1,D=new Array(T-1);H<T;H++)D[H-1]=arguments[H];l[b].fn.apply(l[b].context,D)}}return!0},h.prototype.on=function(i,o,a){return f(this,i,o,a,!1)},h.prototype.once=function(i,o,a){return f(this,i,o,a,!0)},h.prototype.removeListener=function(i,o,a,C){var v=e?e+i:i;if(!this._events[v])return this;if(!o)return d(this,v),this;var y=this._events[v];if(y.fn)y.fn===o&&(!C||y.once)&&(!a||y.context===a)&&d(this,v);else{for(var M=0,l=[],T=y.length;M<T;M++)(y[M].fn!==o||C&&!y[M].once||a&&y[M].context!==a)&&l.push(y[M]);l.length?this._events[v]=l.length===1?l[0]:l:d(this,v)}return this},h.prototype.removeAllListeners=function(i){var o;return i?(o=e?e+i:i,this._events[o]&&d(this,o)):(this._events=new u,this._eventsCount=0),this},h.prototype.off=h.prototype.removeListener,h.prototype.addListener=h.prototype.on,h.prefixed=e,h.EventEmitter=h,r.exports=h})(_);var V=_.exports;const ae=m(V);var ce=function(n){return ue(n)&&!he(n)};function ue(r){return!!r&&typeof r=="object"}function he(r){var n=Object.prototype.toString.call(r);return n==="[object RegExp]"||n==="[object Date]"||pe(r)}var fe=typeof Symbol=="function"&&Symbol.for,de=fe?Symbol.for("react.element"):60103;function pe(r){return r.$$typeof===de}function we(r){return Array.isArray(r)?[]:{}}function N(r,n){return n.clone!==!1&&n.isMergeableObject(r)?I(we(r),r,n):r}function ye(r,n,e){return r.concat(n).map(function(u){return N(u,e)})}function be(r,n){if(!n.customMerge)return I;var e=n.customMerge(r);return typeof e=="function"?e:I}function me(r){return Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(r).filter(function(n){return Object.propertyIsEnumerable.call(r,n)}):[]}function ee(r){return Object.keys(r).concat(me(r))}function te(r,n){try{return n in r}catch{return!1}}function ge(r,n){return te(r,n)&&!(Object.hasOwnProperty.call(r,n)&&Object.propertyIsEnumerable.call(r,n))}function Oe(r,n,e){var u={};return e.isMergeableObject(r)&&ee(r).forEach(function(s){u[s]=N(r[s],e)}),ee(n).forEach(function(s){ge(r,s)||(te(r,s)&&e.isMergeableObject(n[s])?u[s]=be(s,e)(r[s],n[s],e):u[s]=N(n[s],e))}),u}function I(r,n,e){e=e||{},e.arrayMerge=e.arrayMerge||ye,e.isMergeableObject=e.isMergeableObject||ce,e.cloneUnlessOtherwiseSpecified=N;var u=Array.isArray(n),s=Array.isArray(r),f=u===s;return f?u?e.arrayMerge(r,n,e):Oe(r,n,e):N(n,e)}I.all=function(n,e){if(!Array.isArray(n))throw new Error("first argument should be an array");return n.reduce(function(u,s){return I(u,s,e)},{})};var ve=I,Ae=ve;const Ee=m(Ae);/*!
  * is-plain-object <https://github.com/jonschlinkert/is-plain-object>
  *
  * Copyright (c) 2014-2017, Jon Schlinkert.
  * Released under the MIT License.
- */function W(n){return Object.prototype.toString.call(n)==="[object Object]"}function ve(n){var t,e;return W(n)===!1?!1:(t=n.constructor,t===void 0?!0:(e=t.prototype,!(W(e)===!1||e.hasOwnProperty("isPrototypeOf")===!1)))}function Y(n){return n instanceof Element?n:document.querySelector(n)}async function X(n){return await new Promise(t=>setTimeout(t,n))}const Oe='[data-elem="drawer.panel"]',K="data-drawers-group",Z={modal:!0,closeOnEsc:!0,closeOnOutsideClick:!0,closeOnUnderlayClick:!0,onCloseConfirm:()=>!0,onBeforeClose:null,onClose:null,onCloseAnimationEnd:null,onBeforeOpen:null,onOpen:null,onOpenAnimationEnd:null,openClass:"drawer_open",openAnimationDuration:0,closeAnimationDuration:0,lockPageScroll:!0};class V{constructor({target:t,type:e,owner:a}){b(this,S,void 0);b(this,_,void 0);b(this,L,void 0);b(this,R,!1);const s=Y(t);if(!s)throw new Error("Trigger element cannot be found");O(this,S,s),O(this,_,a),O(this,L,e),this.init()}get isActive(){return r(this,R)}init(){r(this,S).addEventListener("click",t=>this.clickHandler(t)),r(this,_).on("open",()=>this.setActive(!0)),r(this,_).on("close",()=>this.setActive(!1))}clickHandler(t){r(this,L)==="open"||r(this,L)==="toggle"?r(this,_).isOpen||r(this,_).open(r(this,S)):(r(this,L)==="close"||r(this,L)==="toggle")&&r(this,_).isOpen&&r(this,_).close(r(this,S))}setActive(t){O(this,R,t),t?r(this,S).classList.add("drawer-trigger_active"):r(this,S).classList.remove("drawer-trigger_active")}}S=new WeakMap,_=new WeakMap,L=new WeakMap,R=new WeakMap;class ee extends se{constructor({target:e,options:a}){super();b(this,m,void 0);b(this,q,void 0);b(this,P,void 0);b(this,I,void 0);O(this,m,me.all(a?[{},Z,a]:[{},Z],{isMergeableObject:ve}));const s=Y(e);if(s===null)throw new Error("Drawer's root cannot be found");const f=s.querySelector(Oe);if(f===null)throw new Error("Drawer's panel cannot be found");O(this,P,{root:s,panel:f}),r(this,P).root.classList.add("drawer_initialized")}get isOpen(){return r(this,I)}get isModal(){return r(this,m).modal}set zIndex(e){r(this,P).root.style.setProperty("--z-index",String(e)),O(this,q,e)}get zIndex(){return r(this,q)}async open(e){r(this,I)||(this.emit("beforeOpen",{drawer:this,trigger:e}),O(this,I,!0),r(this,P).root.classList.add(r(this,m).openClass),this.emit("open",{drawer:this,trigger:e}),typeof r(this,m).openAnimationDuration=="number"&&X(r(this,m).openAnimationDuration),this.emit("openAnimationEnd",{drawer:this,trigger:e}))}async close(e){r(this,m).onCloseConfirm&&!r(this,m).onCloseConfirm(this,e)||(this.emit("beforeClose",{drawer:this,trigger:e}),O(this,I,!1),r(this,P).root.classList.remove(r(this,m).openClass),this.emit("close",{drawer:this,trigger:e}),typeof r(this,m).closeAnimationDuration=="number"&&X(r(this,m).closeAnimationDuration),this.emit("closeAnimationEnd",{drawer:this,trigger:e}))}handleEsc(e){r(this,m).closeOnEsc&&this.close()}handleOutsideClick(e){r(this,m).closeOnOutsideClick&&this.close()}handleUnderlayClick(e){r(this,m).closeOnOutsideClick&&this.close()}}m=new WeakMap,q=new WeakMap,P=new WeakMap,I=new WeakMap;class te{constructor(t){b(this,B,void 0);b(this,C,void 0);b(this,j,void 0);b(this,N,void 0);b(this,M,void 0);b(this,T,void 0);O(this,C,[]),O(this,j,[]),O(this,M,new Set),O(this,T,new Map),this.onBeforeOpen=({drawer:s,trigger:f})=>{s.isModal?(r(this,T).set(s,r(this,C).length),r(this,C).push(s),s.zIndex=r(this,j).length+r(this,C).length):(r(this,T).set(s,r(this,j).length),r(this,j).push(s),s.zIndex=r(this,j).length,r(this,C).length>0&&r(this,C).forEach((d,p)=>d.zIndex=r(this,j).length+p+1)),this.lockScroll(s)},this.onCloseAnimationEnd=({drawer:s,trigger:f})=>{const d=s.isModal?r(this,C):r(this,j);for(delete d[r(this,T).get(s)];d.length&&!d.at(-1);)d.pop();r(this,T).delete(s),this.unlockScroll(s)};const e=Y(t);if(e===null)throw new Error("Drawer's group root cannot be found");O(this,B,e);const a=r(this,B).closest("[data-scrollable], html");if(a===null)throw new Error("Scrollable container for group root cannot be found");O(this,N,a)}add(t){t.on("beforeOpen",this.onBeforeOpen),t.on("closeAnimationEnd",this.onCloseAnimationEnd)}lockScroll(t){r(this,M).size===0&&r(this,N).classList.add("scroll-lock-by-drawer"),r(this,M).add(t)}unlockScroll(t){console.log(r(this,M)),r(this,M).delete(t),r(this,M).size===0&&r(this,N).classList.remove("scroll-lock-by-drawer")}}B=new WeakMap,C=new WeakMap,j=new WeakMap,N=new WeakMap,M=new WeakMap,T=new WeakMap;class ne{constructor(){b(this,G,new Map);b(this,$,new Map)}init(t){document.querySelectorAll(`[${K}]`).forEach(f=>{const d=f.getAttribute(K);typeof d=="string"&&r(this,$).set(d,new te(f))}),document.querySelectorAll("[data-drawer]").forEach(f=>{var i;const d=f.getAttribute("data-drawer");if(typeof d!="string")return;const p=new ee({target:f,options:t});r(this,G).set(d,p);const u=f.closest(`[${K}]`),o=u==null?void 0:u.getAttribute(K);if(typeof o!="string")throw new Error("Group doesn't have alias set correctly");(i=r(this,$).get(o))==null||i.add(p)}),document.querySelectorAll("[data-drawer-open], [data-drawer-close], [data-drawer-toggle]").forEach(f=>{if(f.hasAttribute("data-drawer-open")){const d=f.getAttribute("data-drawer-open");new V({target:f,type:"open",owner:this.get(d)})}else if(f.hasAttribute("data-drawer-close")){const d=f.getAttribute("data-drawer-close");new V({target:f,type:"close",owner:this.get(d)})}else{const d=f.getAttribute("data-drawer-toggle");new V({target:f,type:"toggle",owner:this.get(d)})}})}open(t,{trigger:e,options:a}={}){var s;(s=this.get(t))==null||s.open(e)}close(t,{trigger:e,options:a}={}){var s;(s=this.get(t))==null||s.close(e)}get(t){return r(this,G).get(t)}}G=new WeakMap,$=new WeakMap,typeof window<"u"&&(window.hasOwnProperty("app")||(window.app={}),window.app.drawers=new ne),h.Drawer=ee,h.DrawersGroup=te,h.Trigger=V,h.default=ne,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+ */function ne(r){return Object.prototype.toString.call(r)==="[object Object]"}function Ce(r){var n,e;return ne(r)===!1?!1:(n=r.constructor,n===void 0?!0:(e=n.prototype,!(ne(e)===!1||e.hasOwnProperty("isPrototypeOf")===!1)))}function X(r){return r instanceof Element?r:document.querySelector(r)}async function Z(r){return await new Promise(n=>setTimeout(n,r))}const _e='[data-elem="drawer.panel"]',Y="data-drawers-group",je=["a[href]","area[href]",'input:not([disabled]):not([type="hidden"]):not([aria-hidden])',"select:not([disabled]):not([aria-hidden])","textarea:not([disabled]):not([aria-hidden])","button:not([disabled]):not([aria-hidden])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex^="-"])'],re={modal:!0,focusOnChild:!0,closeOnEsc:!0,closeOnOutsideClick:!0,closeOnUnderlayClick:!0,onCloseConfirm:()=>!0,onBeforeClose:null,onClose:null,onCloseAnimationEnd:null,onBeforeOpen:null,onOpen:null,onOpenAnimationEnd:null,openClass:"drawer_open",openAnimationDuration:0,closeAnimationDuration:0,lockPageScroll:!0};function se(r){return Ee.all(r,{isMergeableObject:Ce})}class J{constructor({target:n,type:e,owner:u}){g(this,j,void 0);g(this,E,void 0);g(this,z,void 0);g(this,q,!1);const s=X(n);if(!s)throw new Error("Trigger element cannot be found");O(this,j,s),O(this,E,u),O(this,z,e),this.init()}get isActive(){return t(this,q)}get owner(){return t(this,E)}init(){t(this,j).addEventListener("click",n=>this.clickHandler(n)),t(this,E).on("open",()=>this.setActive(!0)),t(this,E).on("close",()=>this.setActive(!1))}clickHandler(n){n.__drawerTrigger=this,t(this,z)==="open"?t(this,E).isOpen||t(this,E).open(t(this,j)):t(this,z)==="close"?t(this,E).isOpen&&t(this,E).close(t(this,j)):t(this,E).isOpen?t(this,E).close(t(this,j)):t(this,E).open(t(this,j))}setActive(n){O(this,q,n),n?t(this,j).classList.add("drawer-trigger_active"):t(this,j).classList.remove("drawer-trigger_active")}}j=new WeakMap,E=new WeakMap,z=new WeakMap,q=new WeakMap;class ie extends ae{constructor({target:e,options:u}){super();g(this,w,void 0);g(this,G,void 0);g(this,A,void 0);g(this,P,void 0);g(this,W,void 0);g(this,R,void 0);this.handleDocumentClick=async h=>{var o;if(((o=h.__drawerTrigger)==null?void 0:o.owner)===this)return;const c=h.target;if(h.composedPath(),t(this,A).panel.contains(c))return;const i=c==null?void 0:c.closest("[data-drawer]");i?i.getAttribute("data-drawer")===t(this,R)?this.handleUnderlayClick(h):this.handleOtherDrawerClick(h):this.handleOutsideClick(h)},this.handleKeydown=h=>{t(this,w).closeOnEsc&&h.key==="Escape"&&this.close()};const s=se(u?[re,u]:[re]),f=X(e);if(f===null)throw new Error("Drawer's root cannot be found");const d=f.querySelector(_e);if(d===null)throw new Error("Drawer's panel cannot be found");O(this,A,{root:f,panel:d}),O(this,R,f.getAttribute("data-drawer")),this.setOptions(s),t(this,A).panel.setAttribute("tabindex","-1"),t(this,A).root.classList.add("drawer_initialized")}addEventListeners(){t(this,A).root.addEventListener("keydown",this.handleKeydown),document.addEventListener("click",this.handleDocumentClick)}removeEventListeners(){t(this,A).root.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("click",this.handleDocumentClick)}get isOpen(){return t(this,P)}get isModal(){return t(this,w).modal}set isModal(e){t(this,A).root.classList[e?"add":"remove"]("drawer_modal")}set zIndex(e){t(this,A).root.style.setProperty("--z-index",String(e)),O(this,G,e)}get zIndex(){return t(this,G)}async open(e){Z(1),!t(this,P)&&(this.emit("beforeOpen",{drawer:this,trigger:e}),O(this,P,!0),t(this,A).root.classList.add(t(this,w).openClass),this.emit("open",{drawer:this,trigger:e}),typeof t(this,w).openAnimationDuration=="number"&&Z(t(this,w).openAnimationDuration),this.emit("openAnimationEnd",{drawer:this,trigger:e}),this.focus(),this.addEventListeners())}async close(e){t(this,w).onCloseConfirm&&!t(this,w).onCloseConfirm(this,e)||(this.emit("beforeClose",{drawer:this,trigger:e}),this.removeEventListeners(),O(this,P,!1),t(this,A).root.classList.remove(t(this,w).openClass),this.emit("close",{drawer:this,trigger:e}),typeof t(this,w).closeAnimationDuration=="number"&&Z(t(this,w).closeAnimationDuration),this.emit("closeAnimationEnd",{drawer:this,trigger:e}))}handleOtherDrawerClick(e){}handleOutsideClick(e){t(this,w).closeOnOutsideClick&&(typeof t(this,w).closeOnOutsideClick=="object"&&t(this,w).closeOnOutsideClick.hasOwnProperty("checkTarget")?t(this,w).closeOnOutsideClick.checkTarget(e.target)&&this.close():this.close())}handleUnderlayClick(e){t(this,w).closeOnOutsideClick&&this.close()}focus(){t(this,w).focusOnChild&&this.focusChild()||this.focusSelf()}focusSelf(){t(this,A).panel.focus()}focusChild(){const e=t(this,A).panel.querySelector(je.join(","));return e?(e.focus(),!0):!1}setOptions(e){var u;e.hasOwnProperty("modal")&&((u=t(this,w))==null?void 0:u.modal)!==e.modal&&(this.isModal=e.modal),O(this,w,t(this,w)?se([t(this,w),e]):e)}assignGroup(e){O(this,W,e)}}w=new WeakMap,G=new WeakMap,A=new WeakMap,P=new WeakMap,W=new WeakMap,R=new WeakMap;class oe{constructor(n){g(this,B,void 0);g(this,S,void 0);g(this,L,void 0);g(this,U,void 0);g(this,k,void 0);g(this,x,void 0);O(this,S,[]),O(this,L,[]),O(this,k,new Set),O(this,x,new Map),this.onBeforeOpen=({drawer:s,trigger:f})=>{s.isModal?(t(this,x).set(s,t(this,S).length),t(this,S).push(s),s.zIndex=t(this,L).length+t(this,S).length):(t(this,x).set(s,t(this,L).length),t(this,L).push(s),s.zIndex=t(this,L).length,t(this,S).length>0&&t(this,S).forEach((d,h)=>d.zIndex=t(this,L).length+h+1)),this.lockScroll(s)},this.onCloseAnimationEnd=({drawer:s,trigger:f})=>{const d=s.isModal?t(this,S):t(this,L);for(delete d[t(this,x).get(s)];d.length&&!d.at(-1);)d.pop();t(this,x).delete(s),this.unlockScroll(s)};const e=X(n);if(e===null)throw new Error("Drawer's group root cannot be found");O(this,B,e);const u=t(this,B).closest("[data-scrollable], html");if(u===null)throw new Error("Scrollable container for group root cannot be found");O(this,U,u)}add(n){n.on("beforeOpen",this.onBeforeOpen),n.on("closeAnimationEnd",this.onCloseAnimationEnd),n.assignGroup(this)}lockScroll(n){t(this,k).size===0&&t(this,U).classList.add("scroll-lock-by-drawer"),t(this,k).add(n)}unlockScroll(n){t(this,k).delete(n),t(this,k).size===0&&t(this,U).classList.remove("scroll-lock-by-drawer")}}B=new WeakMap,S=new WeakMap,L=new WeakMap,U=new WeakMap,k=new WeakMap,x=new WeakMap;const F=class F{constructor(){g(this,K,new Map);g(this,$,new Map);if(F.instance)return F.instance;F.instance=this}init(n){document.querySelectorAll(`[${Y}]`).forEach(f=>{const d=f.getAttribute(Y);typeof d=="string"&&t(this,$).set(d,new oe(f))}),document.querySelectorAll("[data-drawer]").forEach(f=>{var o;const d=f.getAttribute("data-drawer");if(typeof d!="string")return;const h=new ie({target:f,options:n});t(this,K).set(d,h);const c=f.closest(`[${Y}]`),i=c==null?void 0:c.getAttribute(Y);if(typeof i!="string")throw new Error("Group doesn't have alias set correctly");(o=t(this,$).get(i))==null||o.add(h)}),document.querySelectorAll("[data-drawer-open], [data-drawer-close], [data-drawer-toggle]").forEach(f=>{if(f.hasAttribute("data-drawer-open")){const d=f.getAttribute("data-drawer-open");new J({target:f,type:"open",owner:this.get(d)})}else if(f.hasAttribute("data-drawer-close")){const d=f.getAttribute("data-drawer-close");new J({target:f,type:"close",owner:this.get(d)})}else{const d=f.getAttribute("data-drawer-toggle");new J({target:f,type:"toggle",owner:this.get(d)})}})}open(n,{trigger:e,options:u}={}){var s;(s=this.get(n))==null||s.open(e)}close(n,{trigger:e,options:u}={}){var s;(s=this.get(n))==null||s.close(e)}get(n){return typeof n=="string"&&t(this,K).get(n)||null}};K=new WeakMap,$=new WeakMap;let Q=F;typeof window<"u"&&(window.hasOwnProperty("app")||(window.app={}),window.app.drawers=new Q),p.Drawer=ie,p.DrawersGroup=oe,p.Trigger=J,p.default=Q,Object.defineProperties(p,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/style.css

@@ -1 +1 @@
-html{overflow-x:hidden;scroll-behavior:auto}body{position:fixed;left:0;top:0;width:100%;background-color:#fff;height:100vh;overflow:hidden;margin:0;scroll-behavior:auto}.drawers-group{position:fixed;left:0;top:0;width:100%;height:100%;pointer-events:none}.drawers{position:absolute;left:0;top:0;width:0;height:0;visibility:hidden}.drawer:nth-child(1){background-color:#0ff}.drawer:nth-child(2){background-color:#8a2be2}.drawer:nth-child(3){background-color:brown}.drawer{position:fixed;left:0;top:0;width:100%;height:100%;overflow:hidden;pointer-events:all}.drawer:not(.transition,.drawer_open){visibility:hidden}.drawer__panel{height:100vh;overflow-x:hidden;visibility:hidden;opacity:0}.drawer.transition .drawer__panel{transition:visibility .4s,opacity .4s,transform .4s}.drawer_open .drawer__panel{visibility:visible;opacity:1;transform:none}
+html{overflow-x:hidden;scroll-behavior:auto}body{position:fixed;left:0;top:0;width:100%;background-color:#fff;height:100vh;overflow:hidden;margin:0;scroll-behavior:auto}.drawers-group{position:fixed;left:0;top:0;width:100%;height:100%;pointer-events:none}.drawers{position:absolute;left:0;top:0;width:0;height:0;visibility:hidden}.drawer:nth-child(1) .drawer__body{background-color:#0ff}.drawer:nth-child(2) .drawer__body{background-color:#8a2be2}.drawer:nth-child(3) .drawer__body{background-color:brown}.drawer{display:flex;justify-content:center;position:fixed;left:0;top:0;width:100%;height:100%;overflow:hidden;pointer-events:all;background-color:#4e4e4e57;z-index:var(--z-index)}.drawer:not(.transition,.drawer_open){visibility:hidden}.drawer__panel{display:flex;height:100%;width:100%;max-width:600px;max-height:400px;margin:auto;overflow-x:hidden;visibility:hidden;opacity:0}.drawer__body{flex:1 1 auto;padding:20px}.drawer.transition .drawer__panel{transition:visibility .4s,opacity .4s,transform .4s}.drawer_open .drawer__panel{visibility:visible;opacity:1;transform:none}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vanilla-drawers",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Drawers controller.",
   "files": [
     "dist"
@@ -14,9 +14,6 @@
       "require": "./dist/drawers.umd.js"
     }
   },
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/techno-trump/drawers.git"
@@ -44,5 +41,8 @@
     "is-plain-object": "^5.0.0",
     "typescript": "^5.3.3",
     "vite": "^5.0.10"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
   }
-}
+}