quirk-ui 0.1.209 → 0.1.211

package/dist/core/components/Modal/Modal.test.mjs

@@ -1,6 +1,6 @@
 import { jsx as p } from "react/jsx-runtime";
-import { j as Q, d as x, b as sn, i as C, r as I, s as y, g as k, w as fe, v as Je } from "../../../react.esm-DKyXDL7m.js";
-import { Modal as S } from "./index.mjs";
+import { j as Q, d as U, b as sn, i as C, r as I, s as y, g as w, w as fe, v as Je } from "../../../react.esm-DKyXDL7m.js";
+import { Modal as _ } from "./index.mjs";
 import "../../../index-DPGXWTtt.js";
 function a(e, t, n) {
   return e.namespaceURI && e.namespaceURI !== "http://www.w3.org/1999/xhtml" || (t = Array.isArray(t) ? t : [
@@ -315,11 +315,11 @@ function ye(e) {
 function yn(e) {
   return e.nodeType === 1 ? e : e.parentElement;
 }
-var St = /* @__PURE__ */ function(e) {
+var _t = /* @__PURE__ */ function(e) {
   return e.button = "button", e.color = "color", e.file = "file", e.image = "image", e.reset = "reset", e.submit = "submit", e.checkbox = "checkbox", e.radio = "radio", e;
-}(St || {});
-function _t(e) {
-  return a(e, "button") || a(e, "input") && e.type in St;
+}(_t || {});
+function St(e) {
+  return a(e, "button") || a(e, "input") && e.type in _t;
 }
 function ne(e) {
   return Ot(e) && !e.readOnly || Y(e);
@@ -334,7 +334,7 @@ function P(e) {
   return At(e) && Ot(e);
 }
 function mn(e) {
-  return At(e) && _t(e);
+  return At(e) && St(e);
 }
 function At(e) {
   return e.nodeType === 1;
@@ -401,7 +401,7 @@ function Mt(e) {
 function In(e) {
   return e[Me];
 }
-function Sn(e, t) {
+function _n(e, t) {
   e[M] = t;
 }
 function ue(e, { focusOffset: t, anchorOffset: n = t }, i = "replace") {
@@ -431,10 +431,10 @@ function me(e) {
     endOffset: Math.max(r.anchorOffset, r.focusOffset)
   };
 }
-function _n(e) {
+function Sn(e) {
   return !!e[M];
 }
-function _e(e) {
+function Se(e) {
   e[M] = void 0;
 }
 const De = globalThis.parseInt;
@@ -457,18 +457,18 @@ function Dt(e, t) {
   const n = e.cloneNode();
   return n.value = t, n.value === t;
 }
-var Ut = /* @__PURE__ */ function(e) {
+var xt = /* @__PURE__ */ function(e) {
   return e.email = "email", e.password = "password", e.search = "search", e.telephone = "telephone", e.text = "text", e.url = "url", e;
-}(Ut || {});
+}(xt || {});
 function On(e) {
   var t;
   const n = (t = e.getAttribute("maxlength")) !== null && t !== void 0 ? t : "";
   return /^\d+$/.test(n) && Number(n) >= 0 ? Number(n) : void 0;
 }
 function An(e) {
-  return a(e, "textarea") || a(e, "input") && e.type in Ut;
+  return a(e, "textarea") || a(e, "input") && e.type in xt;
 }
-function xt(e, t, n, i) {
+function Ut(e, t, n, i) {
   if (Pe(e) && t + n >= 0 && t + n <= e.nodeValue.length)
     return {
       node: e,
@@ -538,7 +538,7 @@ function Dn(e, t, n) {
     var i;
     const r = e[`${t}Sibling`];
     if (r) {
-      if (e = Un(r, t === "next" ? "first" : "last"), n(e))
+      if (e = xn(r, t === "next" ? "first" : "last"), n(e))
         return e;
     } else if (e.parentNode && (!qe(e.parentNode) || !Y(e.parentNode) && e.parentNode !== ((i = e.ownerDocument) === null || i === void 0 ? void 0 : i.body)))
       e = e.parentNode;
@@ -546,17 +546,17 @@ function Dn(e, t, n) {
       break;
   }
 }
-function Un(e, t) {
+function xn(e, t) {
   for (; e.hasChildNodes(); )
     e = e[`${t}Child`];
   return e;
 }
 const Ee = Symbol("Track programmatic changes for React workaround");
-function xn(e) {
+function Un(e) {
   return Object.getOwnPropertyNames(e).some((t) => t.startsWith("__react")) && T(e).REACT_VERSION === 17;
 }
 function Nn(e) {
-  xn(e) && (e[Ee] = {
+  Un(e) && (e[Ee] = {
     previousValue: String(e.value),
     tracked: []
   });
@@ -573,7 +573,7 @@ function Ln(e, t) {
   if (e[Ee] = void 0, !(!(i == null || (n = i.tracked) === null || n === void 0) && n.length))
     return;
   const r = i.tracked.length === 2 && i.tracked[0] === i.previousValue && i.tracked[1] === e.value;
-  r || We(e), _n(e) && ue(e, {
+  r || We(e), Sn(e) && ue(e, {
     focusOffset: r ? t : e.value.length
   });
 }
@@ -632,7 +632,7 @@ function Rn(e, t, n, i, r) {
     "deleteContentBackward",
     "deleteContentForward"
   ].includes(r)) {
-    const s = xt(n.startContainer, n.startOffset, r === "deleteContentBackward" ? -1 : 1, r);
+    const s = Ut(n.startContainer, n.startOffset, r === "deleteContentBackward" ? -1 : 1, r);
     if (s) {
       o = !0;
       const u = n.cloneRange();
@@ -764,7 +764,7 @@ function nt(e, t) {
     if (!(n != null && n.focusNode))
       return;
     if (n.isCollapsed) {
-      const i = xt(n.focusNode, n.focusOffset, t);
+      const i = Ut(n.focusNode, n.focusOffset, t);
       i && J({
         focusNode: i.node,
         focusOffset: i.offset
@@ -948,7 +948,7 @@ $.keyup = (e, t, n) => {
 };
 const rt = {
   " ": (e, t, n) => {
-    if (_t(t))
+    if (St(t))
       return () => n.dispatchUIEvent(t, "click");
   }
 };
@@ -1291,8 +1291,8 @@ function ti(e) {
   var b;
   const v = (b = e.UIEvent) !== null && b !== void 0 ? b : class extends n {
   };
-  var U;
-  const ce = (U = e.CompositionEvent) !== null && U !== void 0 ? U : class extends v {
+  var x;
+  const ce = (x = e.CompositionEvent) !== null && x !== void 0 ? x : class extends v {
   };
   var R;
   const de = (R = e.FocusEvent) !== null && R !== void 0 ? R : class extends v {
@@ -1309,8 +1309,8 @@ function ti(e) {
   var G;
   const nn = (G = e.DragEvent) !== null && G !== void 0 ? G : class extends H {
   };
-  var xe;
-  const rn = (xe = e.PointerEvent) !== null && xe !== void 0 ? xe : class extends H {
+  var Ue;
+  const rn = (Ue = e.PointerEvent) !== null && Ue !== void 0 ? Ue : class extends H {
   };
   var Ne;
   const on = (Ne = e.TouchEvent) !== null && Ne !== void 0 ? Ne : class extends v {
@@ -1554,22 +1554,22 @@ function li(e) {
         Number(n),
         ...i
       ],
-      then: () => r ? void 0 : _e(e)
+      then: () => r ? void 0 : Se(e)
     };
   }), Z(e, "selectionStart", function(n) {
     return {
       realArgs: n,
-      then: () => _e(e)
+      then: () => Se(e)
     };
   }), Z(e, "selectionEnd", function(n) {
     return {
       realArgs: n,
-      then: () => _e(e)
+      then: () => Se(e)
     };
   }), Z(e, "select", function() {
     return {
       realArgs: [],
-      then: () => Sn(e, {
+      then: () => _n(e, {
         anchorOffset: 0,
         focusOffset: O(e).length
       })
@@ -1581,7 +1581,7 @@ function ai(e) {
     return {
       realArgs: n,
       then: () => {
-        We(e), _e(e);
+        We(e), Se(e);
       }
     };
   });
@@ -1614,7 +1614,7 @@ function fi(e) {
 function pi(e) {
   return e.nodeType === 9;
 }
-var w = /* @__PURE__ */ function(e) {
+var k = /* @__PURE__ */ function(e) {
   return e[e.Trigger = 2] = "Trigger", e[e.Call = 1] = "Call", e;
 }({});
 function be(e, t) {
@@ -1642,7 +1642,7 @@ function X(e, t, n) {
     writable: !0
   }) : e[t] = n, e;
 }
-var _ = /* @__PURE__ */ function(e) {
+var S = /* @__PURE__ */ function(e) {
   return e[e.STANDARD = 0] = "STANDARD", e[e.LEFT = 1] = "LEFT", e[e.RIGHT = 2] = "RIGHT", e[e.NUMPAD = 3] = "NUMPAD", e;
 }({});
 const hi = [
@@ -1793,52 +1793,52 @@ const vi = [
   {
     code: "AltLeft",
     key: "Alt",
-    location: _.LEFT
+    location: S.LEFT
   },
   {
     code: "AltRight",
     key: "Alt",
-    location: _.RIGHT
+    location: S.RIGHT
   },
   {
     code: "ShiftLeft",
     key: "Shift",
-    location: _.LEFT
+    location: S.LEFT
   },
   {
     code: "ShiftRight",
     key: "Shift",
-    location: _.RIGHT
+    location: S.RIGHT
   },
   {
     code: "ControlLeft",
     key: "Control",
-    location: _.LEFT
+    location: S.LEFT
   },
   {
     code: "ControlRight",
     key: "Control",
-    location: _.RIGHT
+    location: S.RIGHT
   },
   {
     code: "MetaLeft",
     key: "Meta",
-    location: _.LEFT
+    location: S.LEFT
   },
   {
     code: "MetaRight",
     key: "Meta",
-    location: _.RIGHT
+    location: S.RIGHT
   },
   {
     code: "OSLeft",
     key: "OS",
-    location: _.LEFT
+    location: S.LEFT
   },
   {
     code: "OSRight",
     key: "OS",
-    location: _.RIGHT
+    location: S.RIGHT
   },
   {
     code: "ContextMenu",
@@ -2150,8 +2150,8 @@ function Ci(e, { document: t, target: n, node: i, offset: r }) {
   }
 }
 function Xt(e, t) {
-  var n, i, r, o, s, u, c, d, l, f, h, b, v, U, ce, R, de, V, le, K, ae, j, H, G;
-  return e.target !== t.target || ((n = e.coords) === null || n === void 0 ? void 0 : n.x) !== ((i = t.coords) === null || i === void 0 ? void 0 : i.x) || ((r = e.coords) === null || r === void 0 ? void 0 : r.y) !== ((o = t.coords) === null || o === void 0 ? void 0 : o.y) || ((s = e.coords) === null || s === void 0 ? void 0 : s.clientX) !== ((u = t.coords) === null || u === void 0 ? void 0 : u.clientX) || ((c = e.coords) === null || c === void 0 ? void 0 : c.clientY) !== ((d = t.coords) === null || d === void 0 ? void 0 : d.clientY) || ((l = e.coords) === null || l === void 0 ? void 0 : l.offsetX) !== ((f = t.coords) === null || f === void 0 ? void 0 : f.offsetX) || ((h = e.coords) === null || h === void 0 ? void 0 : h.offsetY) !== ((b = t.coords) === null || b === void 0 ? void 0 : b.offsetY) || ((v = e.coords) === null || v === void 0 ? void 0 : v.pageX) !== ((U = t.coords) === null || U === void 0 ? void 0 : U.pageX) || ((ce = e.coords) === null || ce === void 0 ? void 0 : ce.pageY) !== ((R = t.coords) === null || R === void 0 ? void 0 : R.pageY) || ((de = e.coords) === null || de === void 0 ? void 0 : de.screenX) !== ((V = t.coords) === null || V === void 0 ? void 0 : V.screenX) || ((le = e.coords) === null || le === void 0 ? void 0 : le.screenY) !== ((K = t.coords) === null || K === void 0 ? void 0 : K.screenY) || ((ae = e.caret) === null || ae === void 0 ? void 0 : ae.node) !== ((j = t.caret) === null || j === void 0 ? void 0 : j.node) || ((H = e.caret) === null || H === void 0 ? void 0 : H.offset) !== ((G = t.caret) === null || G === void 0 ? void 0 : G.offset);
+  var n, i, r, o, s, u, c, d, l, f, h, b, v, x, ce, R, de, V, le, K, ae, j, H, G;
+  return e.target !== t.target || ((n = e.coords) === null || n === void 0 ? void 0 : n.x) !== ((i = t.coords) === null || i === void 0 ? void 0 : i.x) || ((r = e.coords) === null || r === void 0 ? void 0 : r.y) !== ((o = t.coords) === null || o === void 0 ? void 0 : o.y) || ((s = e.coords) === null || s === void 0 ? void 0 : s.clientX) !== ((u = t.coords) === null || u === void 0 ? void 0 : u.clientX) || ((c = e.coords) === null || c === void 0 ? void 0 : c.clientY) !== ((d = t.coords) === null || d === void 0 ? void 0 : d.clientY) || ((l = e.coords) === null || l === void 0 ? void 0 : l.offsetX) !== ((f = t.coords) === null || f === void 0 ? void 0 : f.offsetX) || ((h = e.coords) === null || h === void 0 ? void 0 : h.offsetY) !== ((b = t.coords) === null || b === void 0 ? void 0 : b.offsetY) || ((v = e.coords) === null || v === void 0 ? void 0 : v.pageX) !== ((x = t.coords) === null || x === void 0 ? void 0 : x.pageX) || ((ce = e.coords) === null || ce === void 0 ? void 0 : ce.pageY) !== ((R = t.coords) === null || R === void 0 ? void 0 : R.pageY) || ((de = e.coords) === null || de === void 0 ? void 0 : de.screenX) !== ((V = t.coords) === null || V === void 0 ? void 0 : V.screenX) || ((le = e.coords) === null || le === void 0 ? void 0 : le.screenY) !== ((K = t.coords) === null || K === void 0 ? void 0 : K.screenY) || ((ae = e.caret) === null || ae === void 0 ? void 0 : ae.node) !== ((j = t.caret) === null || j === void 0 ? void 0 : j.node) || ((H = e.caret) === null || H === void 0 ? void 0 : H.offset) !== ((G = t.caret) === null || G === void 0 ? void 0 : G.offset);
 }
 function W(e, t, n) {
   return t in e ? Object.defineProperty(e, t, {
@@ -2273,11 +2273,11 @@ class Ii {
     }());
   }
 }
-function Ue(e, t) {
+function xe(e, t) {
   var n;
   return ((n = Wt(e, t)) === null || n === void 0 ? void 0 : n.pointerEvents) !== "none";
 }
-function Si(e) {
+function _i(e) {
   const t = T(e);
   for (let n = e, i = []; n != null && n.ownerDocument; n = n.parentElement) {
     i.push(n);
@@ -2295,12 +2295,12 @@ function Si(e) {
 const pt = Symbol("Last check for pointer-events");
 function Wt(e, t) {
   const n = t[pt];
-  if (!(e.config.pointerEventsCheck !== Oe.Never && (!n || ht(e.config.pointerEventsCheck, Oe.EachApiCall) && n[w.Call] !== Ie(e, w.Call) || ht(e.config.pointerEventsCheck, Oe.EachTrigger) && n[w.Trigger] !== Ie(e, w.Trigger))))
+  if (!(e.config.pointerEventsCheck !== Oe.Never && (!n || ht(e.config.pointerEventsCheck, Oe.EachApiCall) && n[k.Call] !== Ie(e, k.Call) || ht(e.config.pointerEventsCheck, Oe.EachTrigger) && n[k.Trigger] !== Ie(e, k.Trigger))))
     return n == null ? void 0 : n.result;
-  const r = Si(t);
+  const r = _i(t);
   return t[pt] = {
-    [w.Call]: Ie(e, w.Call),
-    [w.Trigger]: Ie(e, w.Trigger),
+    [k.Call]: Ie(e, k.Call),
+    [k.Trigger]: Ie(e, k.Trigger),
     result: r
   }, r;
 }
@@ -2310,11 +2310,11 @@ function ge(e, t) {
     throw new Error([
       `Unable to perform pointer interaction as the element ${n.tree.length > 1 ? "inherits" : "has"} \`pointer-events: none\`:`,
       "",
-      _i(n.tree)
+      Si(n.tree)
     ].join(`
 `));
 }
-function _i(e) {
+function Si(e) {
   return e.reverse().map((t, n) => [
     "".padEnd(n),
     t.tagName,
@@ -2376,7 +2376,7 @@ class Oi {
     const o = this.getTarget(t), s = this.getEventInit(-1), [u, c] = ve(r, o);
     return {
       leave: () => {
-        Ue(t, r) && r !== o && (t.dispatchUIEvent(r, "pointerout", s), u.forEach((d) => t.dispatchUIEvent(d, "pointerleave", s)));
+        xe(t, r) && r !== o && (t.dispatchUIEvent(r, "pointerout", s), u.forEach((d) => t.dispatchUIEvent(d, "pointerleave", s)));
       },
       enter: () => {
         ge(t, o), r !== o && (t.dispatchUIEvent(o, "pointerover", s), c.forEach((d) => t.dispatchUIEvent(d, "pointerenter", s)));
@@ -2400,7 +2400,7 @@ class Oi {
   }
   release(t) {
     const n = this.getTarget(t), [i] = ve(n, null), r = this.getEventInit();
-    Ue(t, n) && (t.dispatchUIEvent(n, "pointerout", r), i.forEach((o) => t.dispatchUIEvent(o, "pointerleave", r))), this.isCancelled = !0;
+    xe(t, n) && (t.dispatchUIEvent(n, "pointerout", r), i.forEach((o) => t.dispatchUIEvent(o, "pointerleave", r))), this.isCancelled = !0;
   }
   getTarget(t) {
     var n;
@@ -2550,7 +2550,7 @@ async function Di(e) {
     "[MouseLeft][MouseLeft]"
   ]);
 }
-async function Ui(e) {
+async function xi(e) {
   return this.pointer([
     {
       target: e
@@ -2558,7 +2558,7 @@ async function Ui(e) {
     "[MouseLeft][MouseLeft][MouseLeft]"
   ]);
 }
-async function xi(e) {
+async function Ui(e) {
   return this.pointer({
     target: e
   });
@@ -2777,7 +2777,7 @@ async function Yi(e, t) {
       offset: (d = t.offset) !== null && d !== void 0 ? d : vt(t) || o == null || (i = o.caret) === null || i === void 0 ? void 0 : i.offset
     }
   };
-  "keyDef" in t ? (e.system.pointer.isKeyPressed(t.keyDef) && (be(e, w.Trigger), await e.system.pointer.release(e, t.keyDef, l)), t.releasePrevious || (be(e, w.Trigger), await e.system.pointer.press(e, t.keyDef, l), t.releaseSelf && (be(e, w.Trigger), await e.system.pointer.release(e, t.keyDef, l)))) : (be(e, w.Trigger), await e.system.pointer.move(e, r, l));
+  "keyDef" in t ? (e.system.pointer.isKeyPressed(t.keyDef) && (be(e, k.Trigger), await e.system.pointer.release(e, t.keyDef, l)), t.releasePrevious || (be(e, k.Trigger), await e.system.pointer.press(e, t.keyDef, l), t.releaseSelf && (be(e, k.Trigger), await e.system.pointer.release(e, t.keyDef, l)))) : (be(e, k.Trigger), await e.system.pointer.move(e, r, l));
 }
 function vt(e) {
   var t, n;
@@ -2830,11 +2830,11 @@ async function Zt(e, t, n) {
   if (a(t, "select"))
     if (t.multiple)
       for (const u of o) {
-        const c = this.config.pointerEventsCheck === 0 ? !0 : Ue(this, u);
+        const c = this.config.pointerEventsCheck === 0 ? !0 : xe(this, u);
         c && (this.dispatchUIEvent(u, "pointerover"), this.dispatchUIEvent(t, "pointerenter"), this.dispatchUIEvent(u, "mouseover"), this.dispatchUIEvent(t, "mouseenter"), this.dispatchUIEvent(u, "pointermove"), this.dispatchUIEvent(u, "mousemove"), this.dispatchUIEvent(u, "pointerdown"), this.dispatchUIEvent(u, "mousedown")), L(t), c && (this.dispatchUIEvent(u, "pointerup"), this.dispatchUIEvent(u, "mouseup")), s(u), c && this.dispatchUIEvent(u, "click"), await se(this.config);
       }
     else if (o.length === 1) {
-      const u = this.config.pointerEventsCheck === 0 ? !0 : Ue(this, t);
+      const u = this.config.pointerEventsCheck === 0 ? !0 : xe(this, t);
       u ? await this.click(t) : L(t), s(o[0]), u && (this.dispatchUIEvent(t, "pointerover"), this.dispatchUIEvent(t, "pointerenter"), this.dispatchUIEvent(t, "mouseover"), this.dispatchUIEvent(t, "mouseenter"), this.dispatchUIEvent(t, "pointerup"), this.dispatchUIEvent(t, "mouseup"), this.dispatchUIEvent(t, "click")), await se(this.config);
     } else
       throw Q().getElementError("Cannot select multiple options on a non-multiple select", t);
@@ -2904,7 +2904,7 @@ async function ir(e, t) {
   };
   n.addEventListener("fileDialog", r), await this.click(e), n.removeEventListener("fileDialog", r);
 }
-function Se(e) {
+function _e(e) {
   return e.toLowerCase().replace(/(\.|\/)jpg\b/g, "$1jpeg");
 }
 function rr(e, t) {
@@ -2915,13 +2915,13 @@ function rr(e, t) {
     "image/*",
     "video/*"
   ];
-  return Se(t).trim().split(/\s*,\s*/).some((i) => i.startsWith(".") ? Se(e.name).endsWith(i) : n.includes(i) ? Se(e.type).startsWith(i.replace("*", "")) : Se(e.type) === i);
+  return _e(t).trim().split(/\s*,\s*/).some((i) => i.startsWith(".") ? _e(e.name).endsWith(i) : n.includes(i) ? _e(e.type).startsWith(i.replace("*", "")) : _e(e.type) === i);
 }
 const mt = {
   click: Mi,
   dblClick: Di,
-  tripleClick: Ui,
-  hover: xi,
+  tripleClick: xi,
+  hover: Ui,
   unhover: Ni,
   tab: Bi,
   keyboard: Vi,
@@ -2991,7 +2991,7 @@ function cr(e) {
 }
 function dr(e, t) {
   function n(...i) {
-    return be(e, w.Call), or(() => t.apply(e, i).then(async (r) => (await se(e.config), r)));
+    return be(e, k.Call), or(() => t.apply(e, i).then(async (r) => (await se(e.config), r)));
   }
   return Object.defineProperty(n, "name", {
     get: () => t.name
@@ -3071,10 +3071,10 @@ function Cr(e, t = {}) {
 function Ir(e, t, n = {}) {
   return m(n).api.upload(e, t);
 }
-function Sr(e = {}) {
+function _r(e = {}) {
   return m().api.tab(e);
 }
-const _r = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const Sr = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   clear: ar,
   click: fr,
@@ -3087,73 +3087,78 @@ const _r = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   paste: Er,
   pointer: mr,
   selectOptions: wr,
-  tab: Sr,
+  tab: _r,
   tripleClick: kr,
   type: Tr,
   unhover: Cr,
   upload: Ir
 }, Symbol.toStringTag, { value: "Module" })), q = {
-  ..._r,
+  ...Sr,
   setup: ur
 };
-x("Modal", () => {
+U("Modal", () => {
   sn(() => {
-    document.body.innerHTML = "", document.body.style.position = "", document.body.style.top = "", document.body.style.width = "", document.body.style.overflowY = "";
-  }), x("Scroll lock", () => {
-    C("locks scroll on body when modal opens", async () => {
+    document.body.innerHTML = "";
+    const e = document.createElement("div");
+    e.id = "__next", document.body.appendChild(e);
+  }), U("Scroll lock", () => {
+    C("sets inert on app root when modal opens", async () => {
       const e = q.setup();
       I(
-        /* @__PURE__ */ p(S, { content: /* @__PURE__ */ p("div", { children: "Content" }), trigger: /* @__PURE__ */ p("button", { children: "Open" }) })
-      ), await e.click(y.getByRole("button", { name: "Open" })), k(document.body.style.position).toBe("fixed");
-    }), C("unlocks scroll on body when modal closes", async () => {
+        /* @__PURE__ */ p(_, { content: /* @__PURE__ */ p("div", { children: "Content" }), trigger: /* @__PURE__ */ p("button", { children: "Open" }) })
+      ), await e.click(y.getByRole("button", { name: "Open" }));
+      const t = document.getElementById("__next");
+      w(t).toHaveAttribute("inert"), w(t == null ? void 0 : t.style.overflow).toBe("hidden");
+    }), C("removes inert from app root when modal closes", async () => {
       const e = q.setup();
       I(
-        /* @__PURE__ */ p(S, { content: /* @__PURE__ */ p("div", { children: "Content" }), trigger: /* @__PURE__ */ p("button", { children: "Open" }) })
+        /* @__PURE__ */ p(_, { content: /* @__PURE__ */ p("div", { children: "Content" }), trigger: /* @__PURE__ */ p("button", { children: "Open" }) })
       ), await e.click(y.getByRole("button", { name: "Open" })), await e.click(y.getByRole("button", { name: /close/i })), await fe(() => {
-        k(document.body.style.position).toBe("");
+        const t = document.getElementById("__next");
+        w(t).not.toHaveAttribute("inert"), w(t == null ? void 0 : t.style.overflow).toBe("");
       });
     });
-  }), x("Rendering", () => {
+  }), U("Rendering", () => {
     C("renders the trigger button", () => {
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Modal Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open Modal" })
           }
         )
-      ), k(
+      ), w(
         y.getByRole("button", { name: "Open Modal" })
       ).toBeInTheDocument();
     }), C("does not render modal content initially", () => {
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Modal Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open Modal" })
           }
         )
-      ), k(y.queryByText("Modal Content")).not.toBeInTheDocument();
+      ), w(y.queryByText("Modal Content")).not.toBeInTheDocument();
     }), C("renders modal content when trigger is clicked", async () => {
       const e = q.setup();
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Modal Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open Modal" })
           }
         )
-      ), await e.click(y.getByRole("button", { name: "Open Modal" })), k(y.getByText("Modal Content")).toBeInTheDocument();
+      ), await e.click(y.getByRole("button", { name: "Open Modal" })), w(y.getByText("Modal Content")).toBeInTheDocument();
     });
-  }), x("Form render prop", () => {
+  }), U("Form render prop", () => {
     C("renders form via renderForm when formData provided", () => {
       const e = { _id: "form-1", heading: "Contact" }, t = Je.fn(() => /* @__PURE__ */ p("form", { "data-testid": "the-form" }));
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             trigger: /* @__PURE__ */ p("button", { children: "Open" }),
             isOpen: !0,
@@ -3161,29 +3166,29 @@ x("Modal", () => {
             renderForm: t
           }
         )
-      ), k(t).toHaveBeenCalledWith(e), k(y.getByTestId("the-form")).toBeInTheDocument();
+      ), w(t).toHaveBeenCalledWith(e), w(y.getByTestId("the-form")).toBeInTheDocument();
     });
-  }), x("Close Button", () => {
+  }), U("Close Button", () => {
     C("closes modal when close button is clicked", async () => {
       const e = q.setup();
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Modal Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open Modal" })
           }
         )
-      ), await e.click(y.getByRole("button", { name: "Open Modal" })), k(y.getByText("Modal Content")).toBeInTheDocument(), await e.click(y.getByRole("button", { name: /close/i })), await fe(() => {
-        k(y.queryByText("Modal Content")).not.toBeInTheDocument();
+      ), await e.click(y.getByRole("button", { name: "Open Modal" })), w(y.getByText("Modal Content")).toBeInTheDocument(), await e.click(y.getByRole("button", { name: /close/i })), await fe(() => {
+        w(y.queryByText("Modal Content")).not.toBeInTheDocument();
       });
     });
-  }), x("Overlay Click", () => {
+  }), U("Overlay Click", () => {
     C("closes modal when clicking overlay by default", async () => {
       const e = q.setup();
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Modal Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open Modal" })
@@ -3192,30 +3197,30 @@ x("Modal", () => {
       ), await e.click(y.getByRole("button", { name: "Open Modal" }));
       const t = document.querySelector(".overlay");
       t && await e.click(t), await fe(() => {
-        k(y.queryByText("Modal Content")).not.toBeInTheDocument();
+        w(y.queryByText("Modal Content")).not.toBeInTheDocument();
       });
     });
-  }), x("Escape Key", () => {
+  }), U("Escape Key", () => {
     C("closes modal on Escape key by default", async () => {
       const e = q.setup();
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Modal Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open Modal" })
           }
         )
       ), await e.click(y.getByRole("button", { name: "Open Modal" })), await e.keyboard("{Escape}"), await fe(() => {
-        k(y.queryByText("Modal Content")).not.toBeInTheDocument();
+        w(y.queryByText("Modal Content")).not.toBeInTheDocument();
       });
     });
-  }), x("Controlled Mode", () => {
+  }), U("Controlled Mode", () => {
     C("calls onClose when close button is clicked in controlled mode", async () => {
       const e = q.setup(), t = Je.fn();
       I(
         /* @__PURE__ */ p(
-          S,
+          _,
           {
             content: /* @__PURE__ */ p("div", { children: "Content" }),
             trigger: /* @__PURE__ */ p("button", { children: "Open" }),
@@ -3224,7 +3229,7 @@ x("Modal", () => {
           }
         )
       ), await e.click(y.getByRole("button", { name: /close/i })), await fe(() => {
-        k(t).toHaveBeenCalled();
+        w(t).toHaveBeenCalled();
       });
     });
   });

package/dist/core/components/Modal/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../index38.css');const e=require("react/jsx-runtime"),c=require("react"),F=require("react-dom"),L=require("../../../x-Dft9NVe_.cjs"),R="_overlay_1dim9_2",P="_fadeIn_1dim9_1",A="_container_1dim9_19",K="_modal_1dim9_49",X="_slideUp_1dim9_1",G="_closeButton_1dim9_60",H="_title_1dim9_87",J="_content_1dim9_97",Q="_intro_1dim9_116",V="_trigger_1dim9_123",W="_overlayFadeIn_1dim9_1",Z="_fadeOut_1dim9_1",O="_closing_1dim9_175",ee="_slideUpSheet_1dim9_1",te="_slideDownSheet_1dim9_1",o={overlay:R,fadeIn:P,container:A,"size-sm":"_size-sm_1dim9_26","size-md":"_size-md_1dim9_30","size-lg":"_size-lg_1dim9_34","size-xl":"_size-xl_1dim9_38","size-full":"_size-full_1dim9_42",modal:K,slideUp:X,closeButton:G,title:H,content:J,intro:Q,trigger:V,overlayFadeIn:W,fadeOut:Z,closing:O,slideUpSheet:ee,slideDownSheet:te},oe=()=>{if(typeof document>"u")return;const s=window.scrollY;document.body.style.position="fixed",document.body.style.top=`-${s}px`,document.body.style.width="100%",document.body.style.overflowY="scroll"},k=()=>{if(typeof document>"u")return;const s=Math.abs(parseInt(document.body.style.top||"0",10));document.body.style.position="",document.body.style.top="",document.body.style.width="",document.body.style.overflowY="",s&&window.scrollTo(0,s)};function ne({content:s,trigger:z,isOpen:v,onOpen:l,onClose:m,size:S="md",closeOnEscape:g=!0,closeOnOverlayClick:$=!0,showCloseButton:E=!0,className:j,overlayClassName:I,style:T,formData:h,renderForm:b}){const[C,p]=c.useState(!1),[_,w]=c.useState(!1),f=c.useRef(null),y=v!==void 0,n=y?v:C,q=()=>{y||p(!0),l==null||l()},r=()=>{w(!0),setTimeout(()=>{w(!1),y?m==null||m():p(!1)},300)},N=()=>n?r():q(),U=()=>{$&&r()};c.useEffect(()=>{if(!g||!n)return;const t=d=>{d.key==="Escape"&&r()};return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[n,g]),c.useEffect(()=>(n?oe():k(),()=>k()),[n]),c.useEffect(()=>{if(!n||!f.current)return;const t=f.current;t.scrollTop=0;const d=t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'),i=d[0],a=d[d.length-1],x=u=>{u.key==="Tab"&&(u.shiftKey?document.activeElement===i&&(u.preventDefault(),a==null||a.focus()):document.activeElement===a&&(u.preventDefault(),i==null||i.focus()))};t.addEventListener("keydown",x);const Y=setTimeout(()=>i==null?void 0:i.focus(),50);return()=>{t.removeEventListener("keydown",x),clearTimeout(Y)}},[n]);const B=o[`size-${S}`]??"",D=s!==void 0?s:e.jsx(e.Fragment,{children:h&&b?b(h):null}),M=n||_?e.jsx("div",{className:`${o.overlay} ${_?o.closing:""} ${I??""}`.trim(),onClick:U,role:"dialog","aria-modal":"true",children:e.jsxs("div",{className:`${B} ${o.container} ${_?o.closing:""}`,children:[E&&e.jsx("button",{"aria-label":"Close",className:o.closeButton,onClick:r,type:"button",children:e.jsx(L.X,{size:20})}),e.jsx("div",{ref:f,className:`${o.modal} ${j??""}`.trim(),style:T,onClick:t=>t.stopPropagation(),children:e.jsx("div",{className:o.content,children:D})})]})}):null;return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:o.trigger,onClick:N,children:z}),typeof window<"u"&&F.createPortal(M,document.body)]})}exports.Modal=ne;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../index38.css');const t=require("react/jsx-runtime"),i=require("react"),M=require("react-dom"),P=require("../../../x-Dft9NVe_.cjs"),F="_overlay_1pts1_2",K="_fadeIn_1pts1_1",X="_fadeOut_1pts1_1",G="_closing_1pts1_14",H="_container_1pts1_20",J="_modal_1pts1_50",Q="_slideUp_1pts1_1",V="_closeButton_1pts1_61",W="_content_1pts1_86",Y="_intro_1pts1_105",Z="_title_1pts1_112",O="_trigger_1pts1_122",ee="_slideUpSheet_1pts1_1",te="_slideDownSheet_1pts1_1",s={overlay:F,fadeIn:K,fadeOut:X,closing:G,container:H,"size-sm":"_size-sm_1pts1_27","size-md":"_size-md_1pts1_31","size-lg":"_size-lg_1pts1_35","size-xl":"_size-xl_1pts1_39","size-full":"_size-full_1pts1_43",modal:J,slideUp:Q,closeButton:V,content:W,intro:Y,title:Z,trigger:O,slideUpSheet:ee,slideDownSheet:te};function se({content:p,trigger:w,isOpen:v,onOpen:l,onClose:c,size:k="md",closeOnEscape:g=!0,closeOnOverlayClick:S=!0,showCloseButton:$=!0,className:j,overlayClassName:I,style:T,formData:y,renderForm:h}){const[B,b]=i.useState(!1),[_,x]=i.useState(!1),f=i.useRef(null),z=i.useRef(null),m=v!==void 0,n=m?v:B,R=n||_,q=()=>{z.current=document.activeElement,m||b(!0),l==null||l()},d=()=>{x(!0),setTimeout(()=>{var e;x(!1),m||b(!1),c==null||c(),(e=z.current)==null||e.focus()},300)},N=()=>n?d():q(),U=()=>{S&&d()};i.useEffect(()=>{if(!g||!n)return;const e=r=>{r.key==="Escape"&&d()};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[n,g]),i.useEffect(()=>{if(typeof document>"u")return;const e=document.getElementById("__next")??document.getElementById("root")??document.body.firstElementChild;if(!(!e||e===document.body))return n?(e.setAttribute("inert",""),e.style.overflow="hidden"):(e.removeAttribute("inert"),e.style.overflow=""),()=>{e.removeAttribute("inert"),e.style.overflow=""}},[n]),i.useEffect(()=>{if(!n||!f.current)return;const e=f.current;e.scrollTop=0;const r=e.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'),o=r[0],a=r[r.length-1],E=u=>{u.key==="Tab"&&(u.shiftKey?document.activeElement===o&&(u.preventDefault(),a==null||a.focus()):document.activeElement===a&&(u.preventDefault(),o==null||o.focus()))};e.addEventListener("keydown",E);const L=setTimeout(()=>o==null?void 0:o.focus(),50);return()=>{e.removeEventListener("keydown",E),clearTimeout(L)}},[n]);const D=s[`size-${k}`]??"",A=p!==void 0?p:t.jsx(t.Fragment,{children:y&&h?h(y):null}),C=R?t.jsx("div",{className:`${s.overlay} ${_?s.closing:""} ${I??""}`.trim(),onClick:U,role:"dialog","aria-modal":"true",children:t.jsxs("div",{className:`${D} ${s.container} ${_?s.closing:""}`,children:[$&&t.jsx("button",{"aria-label":"Close",className:s.closeButton,onClick:d,type:"button",children:t.jsx(P.X,{size:20})}),t.jsx("div",{ref:f,className:`${s.modal} ${j??""}`.trim(),style:T,onClick:e=>e.stopPropagation(),children:t.jsx("div",{className:s.content,children:A})})]})}):null;return t.jsxs(t.Fragment,{children:[t.jsx("div",{className:s.trigger,onClick:N,children:w}),typeof window<"u"&&M.createPortal(C,document.body)]})}exports.Modal=se;