@zag-js/popover 0.0.0-dev-20220604091726 → 0.0.0-dev-20220604123738

package/dist/index.mjs

@@ -18,115 +18,6 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
-// ../../../node_modules/compute-scroll-into-view/dist/index.module.js
-function t(t2) {
-  return typeof t2 == "object" && t2 != null && t2.nodeType === 1;
-}
-function e(t2, e2) {
-  return (!e2 || t2 !== "hidden") && t2 !== "visible" && t2 !== "clip";
-}
-function n(t2, n2) {
-  if (t2.clientHeight < t2.scrollHeight || t2.clientWidth < t2.scrollWidth) {
-    var r2 = getComputedStyle(t2, null);
-    return e(r2.overflowY, n2) || e(r2.overflowX, n2) || function(t3) {
-      var e2 = function(t4) {
-        if (!t4.ownerDocument || !t4.ownerDocument.defaultView)
-          return null;
-        try {
-          return t4.ownerDocument.defaultView.frameElement;
-        } catch (t5) {
-          return null;
-        }
-      }(t3);
-      return !!e2 && (e2.clientHeight < t3.scrollHeight || e2.clientWidth < t3.scrollWidth);
-    }(t2);
-  }
-  return false;
-}
-function r(t2, e2, n2, r2, i, o, l, d) {
-  return o < t2 && l > e2 || o > t2 && l < e2 ? 0 : o <= t2 && d <= n2 || l >= e2 && d >= n2 ? o - t2 - r2 : l > e2 && d < n2 || o < t2 && d > n2 ? l - e2 + i : 0;
-}
-function index_module_default(e2, i) {
-  var o = window, l = i.scrollMode, d = i.block, u = i.inline, h = i.boundary, a = i.skipOverflowHiddenElements, c = typeof h == "function" ? h : function(t2) {
-    return t2 !== h;
-  };
-  if (!t(e2))
-    throw new TypeError("Invalid target");
-  for (var f = document.scrollingElement || document.documentElement, s = [], p = e2; t(p) && c(p); ) {
-    if ((p = p.parentElement) === f) {
-      s.push(p);
-      break;
-    }
-    p != null && p === document.body && n(p) && !n(document.documentElement) || p != null && n(p, a) && s.push(p);
-  }
-  for (var m = o.visualViewport ? o.visualViewport.width : innerWidth, g = o.visualViewport ? o.visualViewport.height : innerHeight, w = window.scrollX || pageXOffset, v = window.scrollY || pageYOffset, W = e2.getBoundingClientRect(), b = W.height, H = W.width, y = W.top, E = W.right, M = W.bottom, V = W.left, x = d === "start" || d === "nearest" ? y : d === "end" ? M : y + b / 2, I = u === "center" ? V + H / 2 : u === "end" ? E : V, C = [], T = 0; T < s.length; T++) {
-    var k = s[T], B = k.getBoundingClientRect(), D = B.height, O = B.width, R = B.top, X = B.right, Y = B.bottom, L = B.left;
-    if (l === "if-needed" && y >= 0 && V >= 0 && M <= g && E <= m && y >= R && M <= Y && V >= L && E <= X)
-      return C;
-    var S = getComputedStyle(k), j = parseInt(S.borderLeftWidth, 10), q = parseInt(S.borderTopWidth, 10), z = parseInt(S.borderRightWidth, 10), A = parseInt(S.borderBottomWidth, 10), F = 0, G = 0, J = "offsetWidth" in k ? k.offsetWidth - k.clientWidth - j - z : 0, K = "offsetHeight" in k ? k.offsetHeight - k.clientHeight - q - A : 0;
-    if (f === k)
-      F = d === "start" ? x : d === "end" ? x - g : d === "nearest" ? r(v, v + g, g, q, A, v + x, v + x + b, b) : x - g / 2, G = u === "start" ? I : u === "center" ? I - m / 2 : u === "end" ? I - m : r(w, w + m, m, j, z, w + I, w + I + H, H), F = Math.max(0, F + v), G = Math.max(0, G + w);
-    else {
-      F = d === "start" ? x - R - q : d === "end" ? x - Y + A + K : d === "nearest" ? r(R, Y, D, q, A + K, x, x + b, b) : x - (R + D / 2) + K / 2, G = u === "start" ? I - L - j : u === "center" ? I - (L + O / 2) + J / 2 : u === "end" ? I - X + z + J : r(L, X, O, j, z + J, I, I + H, H);
-      var N = k.scrollLeft, P = k.scrollTop;
-      x += P - (F = Math.max(0, Math.min(P + F, k.scrollHeight - D + K))), I += N - (G = Math.max(0, Math.min(N + G, k.scrollWidth - O + J)));
-    }
-    C.push({ el: k, top: F, left: G });
-  }
-  return C;
-}
-
-// ../../utilities/dom/node_modules/scroll-into-view-if-needed/es/index.js
-function isOptionsObject(options) {
-  return options === Object(options) && Object.keys(options).length !== 0;
-}
-function defaultBehavior(actions, behavior) {
-  if (behavior === void 0) {
-    behavior = "auto";
-  }
-  var canSmoothScroll = "scrollBehavior" in document.body.style;
-  actions.forEach(function(_ref) {
-    var el = _ref.el, top = _ref.top, left = _ref.left;
-    if (el.scroll && canSmoothScroll) {
-      el.scroll({
-        top,
-        left,
-        behavior
-      });
-    } else {
-      el.scrollTop = top;
-      el.scrollLeft = left;
-    }
-  });
-}
-function getOptions(options) {
-  if (options === false) {
-    return {
-      block: "end",
-      inline: "nearest"
-    };
-  }
-  if (isOptionsObject(options)) {
-    return options;
-  }
-  return {
-    block: "start",
-    inline: "nearest"
-  };
-}
-function scrollIntoView(target, options) {
-  var isTargetAttached = target.isConnected || target.ownerDocument.documentElement.contains(target);
-  if (isOptionsObject(options) && typeof options.behavior === "function") {
-    return options.behavior(isTargetAttached ? index_module_default(target, options) : []);
-  }
-  if (!isTargetAttached) {
-    return;
-  }
-  var computeOptions = getOptions(options);
-  return defaultBehavior(index_module_default(target, computeOptions), computeOptions.behavior);
-}
-var es_default = scrollIntoView;
-
 // ../../utilities/dom/dist/index.mjs
 var dataAttr = (guard) => {
   return guard ? "" : void 0;
@@ -168,6 +59,10 @@ function raf(fn) {
     globalThis.cancelAnimationFrame(id);
   };
 }
+var isDom = () => typeof window !== "undefined";
+var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
+var isTouchDevice = isDom() && !!navigator.maxTouchPoints;
+var isLeftClick = (v) => v.button === 0;
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
   return res != null ? res : void 0;
@@ -175,14 +70,6 @@ var runIfFn = (v, ...a) => {
 var noop = () => {
 };
 var pipe = (...fns) => (v) => fns.reduce((a, b) => b(a), v);
-var platform = (v) => isDom() && v.test(navigator.platform);
-var isDom = () => typeof window !== "undefined";
-var isMac = () => platform(/^Mac/);
-var isIPhone = () => platform(/^iPhone/);
-var isIPad = () => platform(/^iPad/) || isMac() && navigator.maxTouchPoints > 1;
-var isIos = () => isIPhone() || isIPad();
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-var isLeftClick = (v) => v.button === 0;
 function getListenerElements() {
   ;
   globalThis.__listenerElements__ = globalThis.__listenerElements__ || /* @__PURE__ */ new Map();
@@ -308,21 +195,6 @@ function preventBodyPointerEvents(el, opts = {}) {
     cleanups.forEach((cleanup) => cleanup == null ? void 0 : cleanup());
   };
 }
-function getOwnerDocument(el) {
-  var _a;
-  if (isWindow(el))
-    return el.document;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
-}
-function getNodeName(node) {
-  return isWindow(node) ? "" : node ? node.localName || "" : "";
-}
-function getParent(el) {
-  const doc = getOwnerDocument(el);
-  if (getNodeName(el) === "html")
-    return el;
-  return el.assignedSlot || el.parentElement || doc.documentElement;
-}
 function contains(parent, child) {
   if (!parent)
     return false;
@@ -331,124 +203,9 @@ function contains(parent, child) {
 function isHTMLElement(v) {
   return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
 }
-function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
-}
 var isDisabled = (el) => {
   return (el == null ? void 0 : el.getAttribute("disabled")) != null || !!(el == null ? void 0 : el.getAttribute("aria-disabled")) === true;
 };
-function isScrollParent(el) {
-  const { overflow, overflowX, overflowY } = getComputedStyle2(el);
-  return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
-}
-function getScrollParent(el) {
-  if (["html", "body", "#document"].includes(getNodeName(el))) {
-    return getOwnerDocument(el).body;
-  }
-  if (isHTMLElement(el) && isScrollParent(el)) {
-    return el;
-  }
-  return getScrollParent(getParent(el));
-}
-var nonTextInputTypes = /* @__PURE__ */ new Set(["checkbox", "radio", "range", "color", "file", "image", "button", "submit", "reset"]);
-function preventBodyScroll(opts) {
-  var _a;
-  const { document: docProp, disabled = false, allowPinchZoom } = opts != null ? opts : {};
-  const doc = docProp != null ? docProp : document;
-  const win = (_a = doc == null ? void 0 : doc.defaultView) != null ? _a : window;
-  const viewport = isDom() ? win.visualViewport : null;
-  const docEl = doc.documentElement;
-  function preventScrollStandard() {
-    if (docEl.hasAttribute("scroll-lock"))
-      return;
-    const fn = pipe(setStyle(docEl, "paddingRight", `${win.innerWidth - docEl.clientWidth}px`), setStyle(docEl, "overflow", "hidden"), () => docEl.setAttribute("scroll-lock", "true"));
-    return pipe(fn, () => docEl.removeAttribute("scroll-lock"));
-  }
-  function preventScrollMobileSafari() {
-    if (docEl.hasAttribute("scroll-lock"))
-      return;
-    let scrollable;
-    let lastY = 0;
-    let onTouchStart = (e2) => {
-      scrollable = getScrollParent(e2.target);
-      if (scrollable === docEl && scrollable === doc.body) {
-        return;
-      }
-      lastY = e2.changedTouches[0].pageY;
-    };
-    let onTouchMove = (e2) => {
-      if (e2.touches.length === 2 && allowPinchZoom)
-        return;
-      if (!scrollable || scrollable === docEl || scrollable === doc.body) {
-        e2.preventDefault();
-        return;
-      }
-      let y = e2.changedTouches[0].pageY;
-      let scrollTop = scrollable.scrollTop;
-      let bottom = scrollable.scrollHeight - scrollable.clientHeight;
-      if (scrollTop <= 0 && y > lastY || scrollTop >= bottom && y < lastY) {
-        e2.preventDefault();
-      }
-      lastY = y;
-    };
-    let onTouchEnd = (e2) => {
-      let target = e2.target;
-      if (target instanceof win.HTMLInputElement && !nonTextInputTypes.has(target.type)) {
-        e2.preventDefault();
-        target.style.transform = "translateY(-2000px)";
-        target.focus();
-        win.requestAnimationFrame(() => {
-          target.style.transform = "";
-        });
-      }
-    };
-    let onFocus = (e2) => {
-      let target = e2.target;
-      if (target instanceof win.HTMLInputElement && !nonTextInputTypes.has(target.type)) {
-        target.style.transform = "translateY(-2000px)";
-        win.requestAnimationFrame(() => {
-          target.style.transform = "";
-          if (!viewport)
-            return;
-          if (viewport.height < win.innerHeight) {
-            win.requestAnimationFrame(function() {
-              es_default(target, { scrollMode: "if-needed" });
-            });
-          } else {
-            const onResize = () => {
-              es_default(target, { scrollMode: "if-needed" });
-            };
-            addDomEvent(viewport, "resize", onResize, { once: true });
-          }
-        });
-      }
-    };
-    let onWindowScroll = () => {
-      win.scrollTo(0, 0);
-    };
-    let scrollX = win.scrollX;
-    let scrollY = win.scrollY;
-    let restoreStyles = pipe(setStyle(docEl, "paddingRight", `${win.innerWidth - docEl.clientWidth}px`), setStyle(docEl, "overflow", "hidden"), setStyle(doc.body, "marginTop", `-${scrollY}px`));
-    win.scrollTo(0, 0);
-    let removeEvents = pipe(addDomEvent(doc, "touchstart", onTouchStart, { passive: false, capture: true }), addDomEvent(doc, "touchmove", onTouchMove, { passive: false, capture: true }), addDomEvent(doc, "touchend", onTouchEnd, { passive: false, capture: true }), addDomEvent(doc, "focus", onFocus, true), addDomEvent(win, "scroll", onWindowScroll), () => docEl.setAttribute("scroll-lock", "true"));
-    return () => {
-      restoreStyles();
-      removeEvents();
-      win.scrollTo(scrollX, scrollY);
-      docEl.removeAttribute("scroll-lock");
-    };
-  }
-  if (disabled)
-    return noop;
-  return isIos() ? preventScrollMobileSafari() : preventScrollStandard();
-}
-function setStyle(el, key, value) {
-  let cur = el.style[key];
-  el.style[key] = value;
-  return () => {
-    el.style[key] = cur;
-  };
-}
 function validateBlur(event, opts) {
   var _a;
   const exclude = Array.isArray(opts.exclude) ? opts.exclude : [opts.exclude];
@@ -603,6 +360,8 @@ function nextIndex(v, idx, opts = {}) {
 function next(v, idx, opts = {}) {
   return v[nextIndex(v, idx, opts)];
 }
+var isDom2 = () => typeof window !== "undefined";
+var isTouchDevice2 = isDom2() && !!navigator.maxTouchPoints;
 var runIfFn2 = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
   return res != null ? res : void 0;
@@ -782,6 +541,7 @@ function connect(state, send, normalize = normalizeProp) {
 import { ariaHidden } from "@zag-js/aria-hidden";
 import { createMachine, guards, ref } from "@zag-js/core";
 import { getPlacement } from "@zag-js/popper";
+import { preventBodyScroll } from "@zag-js/remove-scroll";
 import { createFocusTrap } from "focus-trap";
 var { and, or } = guards;
 function machine(ctx = {}) {
@@ -812,7 +572,7 @@ function machine(ctx = {}) {
       unknown: {
         on: {
           SETUP: {
-            target: "closed",
+            target: ctx.open ? "open" : "closed",
             actions: ["setupDocument", "checkRenderedElements"]
           }
         }
@@ -911,7 +671,6 @@ function machine(ctx = {}) {
       },
       preventScroll(ctx2) {
         return preventBodyScroll({
-          allowPinchZoom: true,
           disabled: !ctx2.modal,
           document: dom.getDoc(ctx2)
         });
@@ -934,7 +693,7 @@ function machine(ctx = {}) {
           });
           try {
             trap.activate();
-          } catch (e2) {
+          } catch (e) {
           }
         });
         return () => trap == null ? void 0 : trap.deactivate();