tamagui 1.134.5 → 1.135.1

package/dist/native.js

@@ -13354,6 +13354,9 @@ var require_index_native19 = __commonJS({
       }), mod);
     }, index_exports2 = {};
     __export2(index_exports2, {
+      LayoutMeasurementController: function() {
+        return LayoutMeasurementController2;
+      },
       createMeasure: function() {
         return createMeasure;
       },
@@ -13392,18 +13395,29 @@ var require_index_native19 = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(index_exports2);
-    var import_constants4 = require_index_native(), import_is_equal_shallow = require_index_native12(), LayoutHandlers = /* @__PURE__ */ new WeakMap(), Nodes = /* @__PURE__ */ new Set(), IntersectionState = /* @__PURE__ */ new WeakMap(), globalIntersectionObserver = null, strategy = "async";
+    var import_jsx_runtime6 = require("react/jsx-runtime"), import_constants4 = require_index_native(), import_is_equal_shallow = require_index_native12(), import_react3 = require("react"), LayoutHandlers = /* @__PURE__ */ new WeakMap(), LayoutDisableKey = /* @__PURE__ */ new WeakMap(), Nodes = /* @__PURE__ */ new Set(), IntersectionState = /* @__PURE__ */ new WeakMap(), DisableLayoutContextValues = {}, DisableLayoutContextKey = /* @__PURE__ */ (0, import_react3.createContext)(""), ENABLE = import_constants4.isClient && typeof IntersectionObserver < "u", LayoutMeasurementController2 = function(param) {
+      var { disable, children } = param, id = (0, import_react3.useId)();
+      return (0, import_constants4.useIsomorphicLayoutEffect)(function() {
+        DisableLayoutContextValues[id] = disable;
+      }, [
+        disable,
+        id
+      ]), /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DisableLayoutContextKey.Provider, {
+        value: id,
+        children
+      });
+    }, globalIntersectionObserver = null, strategy = "async";
     function setOnLayoutStrategy3(state) {
       strategy = state;
     }
-    var NodeRectCache = /* @__PURE__ */ new WeakMap(), ParentRectCache = /* @__PURE__ */ new WeakMap(), LastChangeTime = /* @__PURE__ */ new WeakMap(), rAF = typeof window < "u" ? window.requestAnimationFrame : void 0, avoidUpdates = !0, queuedUpdates = /* @__PURE__ */ new Map();
+    var NodeRectCache = /* @__PURE__ */ new WeakMap(), LastChangeTime = /* @__PURE__ */ new WeakMap(), avoidUpdates = !0, queuedUpdates = /* @__PURE__ */ new Map();
     function enable() {
       avoidUpdates && (avoidUpdates = !1, queuedUpdates && (queuedUpdates.forEach(function(cb) {
         return cb();
       }), queuedUpdates.clear()));
     }
     function startGlobalObservers() {
-      !import_constants4.isClient || globalIntersectionObserver || (globalIntersectionObserver = new IntersectionObserver(function(entries) {
+      !ENABLE || globalIntersectionObserver || (globalIntersectionObserver = new IntersectionObserver(function(entries) {
         entries.forEach(function(entry) {
           var node = entry.target;
           IntersectionState.get(node) !== entry.isIntersecting && IntersectionState.set(node, entry.isIntersecting);
@@ -13412,29 +13426,29 @@ var require_index_native19 = __commonJS({
         threshold: 0
       }));
     }
-    if (import_constants4.isClient) if (rAF) {
-      supportsCheckVisibility = "checkVisibility" in document.body, BoundingRects = /* @__PURE__ */ new WeakMap();
+    if (ENABLE) {
+      BoundingRects = /* @__PURE__ */ new WeakMap();
       async function updateLayoutIfChanged(node) {
-        if (IntersectionState.get(node) !== !1 && !(process.env.TAMAGUI_ONLAYOUT_VISIBILITY_CHECK === "1" && supportsCheckVisibility && !node.checkVisibility())) {
-          var onLayout = LayoutHandlers.get(node);
-          if (typeof onLayout == "function") {
-            var parentNode = node.parentElement;
-            if (parentNode) {
-              var nodeRect, parentRect;
-              if (strategy === "async") {
-                var [nr, pr] = await Promise.all([
-                  BoundingRects.get(node) || getBoundingClientRectAsync(node),
-                  BoundingRects.get(parentNode) || getBoundingClientRectAsync(parentNode)
-                ]);
-                if (nr === !1 || pr === !1) return;
-                nodeRect = nr, parentRect = pr;
-              } else nodeRect = node.getBoundingClientRect(), parentRect = parentNode.getBoundingClientRect();
+        var onLayout = LayoutHandlers.get(node);
+        if (typeof onLayout == "function") {
+          var parentNode = node.parentElement;
+          if (parentNode) {
+            var nodeRect, parentRect;
+            if (strategy === "async") {
+              var [nr, pr] = await Promise.all([
+                BoundingRects.get(node),
+                BoundingRects.get(parentNode)
+              ]);
+              if (!nr || !pr) return;
+              nodeRect = nr, parentRect = pr;
+            } else nodeRect = node.getBoundingClientRect(), parentRect = parentNode.getBoundingClientRect();
+            if (!(!nodeRect || !parentRect)) {
               var cachedRect = NodeRectCache.get(node), cachedParentRect = NodeRectCache.get(parentNode);
-              if (!cachedRect || // has changed one rect
+              if (!cachedRect || !cachedParentRect || // has changed one rect
               // @ts-expect-error DOMRectReadOnly can go into object
-              !(0, import_is_equal_shallow.isEqualShallow)(cachedRect, nodeRect) && // @ts-expect-error DOMRectReadOnly can go into object
-              (!cachedParentRect || !(0, import_is_equal_shallow.isEqualShallow)(cachedParentRect, parentRect))) {
-                NodeRectCache.set(node, nodeRect), ParentRectCache.set(parentNode, parentRect);
+              !(0, import_is_equal_shallow.isEqualShallow)(cachedRect, nodeRect) || // @ts-expect-error DOMRectReadOnly can go into object
+              !(0, import_is_equal_shallow.isEqualShallow)(cachedParentRect, parentRect)) {
+                NodeRectCache.set(node, nodeRect), NodeRectCache.set(parentNode, parentRect);
                 var event = getElementLayoutEvent(nodeRect, parentRect);
                 avoidUpdates ? queuedUpdates.set(node, function() {
                   return onLayout(event);
@@ -13444,14 +13458,10 @@ var require_index_native19 = __commonJS({
           }
         }
       }
-      rAF(layoutOnAnimationFrame), frameCount = 0, userSkipVal = process.env.TAMAGUI_LAYOUT_FRAME_SKIP, RUN_EVERY_X_FRAMES = userSkipVal ? +userSkipVal : 10;
+      userSkipVal = process.env.TAMAGUI_LAYOUT_FRAME_SKIP, RUN_EVERY_X_FRAMES = userSkipVal ? +userSkipVal : 14;
       async function layoutOnAnimationFrame() {
         if (strategy !== "off") {
-          if (!Nodes.size || frameCount++ % RUN_EVERY_X_FRAMES !== 0) {
-            rAF(layoutOnAnimationFrame);
-            return;
-          }
-          frameCount === Number.MAX_SAFE_INTEGER && (frameCount = 0), await new Promise(function(res) {
+          var visibleNodes = [], didRun = await new Promise(function(res) {
             var io = new IntersectionObserver(function(entries) {
               io.disconnect();
               var _iteratorNormalCompletion2 = !0, _didIteratorError2 = !1, _iteratorError2 = void 0;
@@ -13469,14 +13479,17 @@ var require_index_native19 = __commonJS({
                   if (_didIteratorError2) throw _iteratorError2;
                 }
               }
-              res();
+              res(!0);
             }, {
               threshold: 0
-            }), _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+            }), didObserve = !1, _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
             try {
               for (var _iterator = Nodes[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
                 var node = _step.value;
-                node.parentElement instanceof HTMLElement && (io.observe(node), io.observe(node.parentElement));
+                if (node.parentElement instanceof HTMLElement) {
+                  var disableKey = LayoutDisableKey.get(node);
+                  disableKey && DisableLayoutContextValues[disableKey] === !0 || IntersectionState.get(node) !== !1 && (didObserve = !0, io.observe(node), io.observe(node.parentElement), visibleNodes.push(node));
+                }
               }
             } catch (err) {
               _didIteratorError = !0, _iteratorError = err;
@@ -13487,14 +13500,17 @@ var require_index_native19 = __commonJS({
                 if (_didIteratorError) throw _iteratorError;
               }
             }
-          }), Nodes.forEach(function(node) {
+            didObserve || res(!1);
+          });
+          didRun && visibleNodes.forEach(function(node) {
             updateLayoutIfChanged(node);
           });
         }
-        rAF(layoutOnAnimationFrame);
+        setTimeout(layoutOnAnimationFrame, 16.6667 * RUN_EVERY_X_FRAMES);
       }
-    } else process.env.NODE_ENV === "development" && console.warn("No requestAnimationFrame - please polyfill for onLayout to work correctly");
-    var supportsCheckVisibility, BoundingRects, frameCount, userSkipVal, RUN_EVERY_X_FRAMES, getElementLayoutEvent = function(nodeRect, parentRect) {
+      layoutOnAnimationFrame();
+    }
+    var BoundingRects, userSkipVal, RUN_EVERY_X_FRAMES, getElementLayoutEvent = function(nodeRect, parentRect) {
       return {
         nativeEvent: {
           layout: getRelativeDimensions(nodeRect, parentRect),
@@ -13514,8 +13530,8 @@ var require_index_native19 = __commonJS({
       };
     };
     function useElementLayout(ref, onLayout) {
-      var _ref_current, node = ensureWebElement((_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.host);
-      node && onLayout && LayoutHandlers.set(node, onLayout), (0, import_constants4.useIsomorphicLayoutEffect)(function() {
+      var _ref_current, disableKey = (0, import_react3.useContext)(DisableLayoutContextKey), node = ensureWebElement((_ref_current = ref.current) === null || _ref_current === void 0 ? void 0 : _ref_current.host);
+      node && onLayout && (LayoutHandlers.set(node, onLayout), LayoutDisableKey.set(node, disableKey)), (0, import_constants4.useIsomorphicLayoutEffect)(function() {
         var _ref_current2;
         if (onLayout) {
           var node2 = (_ref_current2 = ref.current) === null || _ref_current2 === void 0 ? void 0 : _ref_current2.host;
@@ -14109,6 +14125,9 @@ var require_index_native20 = __commonJS({
       }), mod);
     }, index_exports2 = {};
     __export2(index_exports2, {
+      LayoutMeasurementController: function() {
+        return import_use_element_layout2.LayoutMeasurementController;
+      },
       Stack: function() {
         return Stack2;
       },
@@ -18527,26 +18546,27 @@ var require_SheetImplementationCustom_native = __commonJS({
             ...animationConfig
           }));
         }
-      }), isAbleToPosition = /* @__PURE__ */ function() {
-        return !(disableAnimation || !frameSize || !screenSize || isHidden || hasntMeasured && !open);
-      }();
+      });
       (0, import_constants4.useIsomorphicLayoutEffect)(function() {
-        hasntMeasured && screenSize && frameSize && (at.current = screenSize, animatedNumber.setValue(screenSize, {
-          type: "timing",
-          duration: 0
-        }, function() {
-          setTimeout(function() {
-            setDisableAnimation(!1);
-          }, 10);
-        }));
+        if (hasntMeasured && screenSize && frameSize) {
+          at.current = screenSize, animatedNumber.setValue(screenSize, {
+            type: "timing",
+            duration: 0
+          }, function() {
+            setTimeout(function() {
+              setDisableAnimation(!1);
+            }, 10);
+          });
+          return;
+        }
+        disableAnimation || !frameSize || !screenSize || isHidden || hasntMeasured && !open || (animateTo(position), position === -1 && (scrollBridge.scrollLock = !1, scrollBridge.scrollStartY = -1));
       }, [
         hasntMeasured,
+        disableAnimation,
+        isHidden,
+        frameSize,
         screenSize,
-        frameSize
-      ]), (0, import_constants4.useIsomorphicLayoutEffect)(function() {
-        isAbleToPosition && (animateTo(position), position === -1 && (scrollBridge.scrollLock = !1, scrollBridge.scrollStartY = -1));
-      }, [
-        isAbleToPosition,
+        open,
         position
       ]);
       var _props_disableDrag, disableDrag = (_props_disableDrag = props.disableDrag) !== null && _props_disableDrag !== void 0 ? _props_disableDrag : controller == null ? void 0 : controller.disableDrag, themeName = (0, import_core12.useThemeName)(), [isDragging, setIsDragging] = import_react3.default.useState(!1), panResponder = import_react3.default.useMemo(function() {
@@ -18670,59 +18690,62 @@ var require_SheetImplementationCustom_native = __commonJS({
       ]);
       var forcedContentHeight = hasFit ? void 0 : snapPointsMode === "percent" ? `${maxSnapPoint}${import_constants4.isWeb ? "dvh" : "%"}` : maxSnapPoint, setHasScrollView = import_react3.default.useCallback(function(val) {
         hasScrollView.current = val;
-      }, []), contents = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_contexts.ParentSheetContext.Provider, {
-        value: nextParentContext,
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_SheetContext.SheetProvider, {
-          ...providerProps,
-          setHasScrollView,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_animate_presence.AnimatePresence, {
-              custom: {
-                open
-              },
-              children: shouldHideParentSheet || !open ? null : overlayComponent
-            }),
-            snapPointsMode !== "percent" && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native4.View, {
-              style: {
-                opacity: 0,
-                position: "absolute",
-                top: 0,
-                left: 0,
-                right: 0,
-                bottom: 0,
-                pointerEvents: "none"
-              },
-              onLayout: handleMaxContentViewLayout
-            }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AnimatedView, {
-              ref,
-              ...panResponder == null ? void 0 : panResponder.panHandlers,
-              onLayout: handleAnimationViewLayout,
-              // @ts-ignore for CSS driver this is necessary to attach the transition
-              // also motion driver at least though i suspect all drivers?
-              animation: isDragging || disableAnimation ? null : animation,
-              // @ts-ignore
-              disableClassName: !0,
-              style: [
-                {
+      }, []), contents = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core12.LayoutMeasurementController, {
+        disable: !open,
+        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_contexts.ParentSheetContext.Provider, {
+          value: nextParentContext,
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_SheetContext.SheetProvider, {
+            ...providerProps,
+            setHasScrollView,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_animate_presence.AnimatePresence, {
+                custom: {
+                  open
+                },
+                children: shouldHideParentSheet || !open ? null : overlayComponent
+              }),
+              snapPointsMode !== "percent" && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native4.View, {
+                style: {
+                  opacity: 0,
                   position: "absolute",
-                  zIndex,
-                  width: "100%",
-                  height: forcedContentHeight,
-                  minHeight: forcedContentHeight,
-                  opacity: shouldHideParentSheet ? 0 : opacity,
-                  ...(shouldHideParentSheet || !open) && {
-                    pointerEvents: "none"
-                  }
+                  top: 0,
+                  left: 0,
+                  right: 0,
+                  bottom: 0,
+                  pointerEvents: "none"
                 },
-                animatedStyle
-              ],
-              children: (
-                /* <AdaptProvider>{props.children}</AdaptProvider> */
-                props.children
-              )
-            })
-          ]
+                onLayout: handleMaxContentViewLayout
+              }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AnimatedView, {
+                ref,
+                ...panResponder == null ? void 0 : panResponder.panHandlers,
+                onLayout: handleAnimationViewLayout,
+                // @ts-ignore for CSS driver this is necessary to attach the transition
+                // also motion driver at least though i suspect all drivers?
+                animation: isDragging || disableAnimation ? null : animation,
+                // @ts-ignore
+                disableClassName: !0,
+                style: [
+                  {
+                    position: "absolute",
+                    zIndex,
+                    width: "100%",
+                    height: forcedContentHeight,
+                    minHeight: forcedContentHeight,
+                    opacity: shouldHideParentSheet ? 0 : opacity,
+                    ...(shouldHideParentSheet || !open) && {
+                      pointerEvents: "none"
+                    }
+                  },
+                  animatedStyle
+                ],
+                children: (
+                  /* <AdaptProvider>{props.children}</AdaptProvider> */
+                  props.children
+                )
+              })
+            ]
+          })
         })
       });
       if (!import_portal2.USE_NATIVE_PORTAL) {
@@ -19841,16 +19864,19 @@ var require_Dialog_native = __commonJS({
         // NOTE: we remove the inner frame, but not the portal itself
         // saw a bug when we removed and re-added portals that caused stale inner contents of the portal
         // seems like a React bug itself but leaving this for now as it fixes
-        isFullyHidden && !isAdapted ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DialogPortalFrame, {
-          ref,
-          ...import_constants4.isWeb && isMountedOrOpen && {
-            "aria-modal": !0
-          },
-          // passThrough={isAdapted}
-          pointerEvents: isMountedOrOpen ? "auto" : "none",
-          ...frameProps,
-          className: "_no_backdrop " + (frameProps.className || ""),
-          children: contents
+        isFullyHidden && !isAdapted ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core12.LayoutMeasurementController, {
+          disable: !isMountedOrOpen,
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DialogPortalFrame, {
+            ref,
+            ...import_constants4.isWeb && isMountedOrOpen && {
+              "aria-modal": !0
+            },
+            // passThrough={isAdapted}
+            pointerEvents: isMountedOrOpen ? "auto" : "none",
+            ...frameProps,
+            className: "_no_backdrop " + (frameProps.className || ""),
+            children: contents
+          })
         })
       );
       return import_constants4.isWeb ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_portal2.Portal, {
@@ -24478,13 +24504,13 @@ var require_Popper_native = __commonJS({
       Object.assign(setupOptions, options);
     }
     function Popper(props) {
-      var { children, size: size2, strategy = "absolute", placement = "bottom", stayInFrame, allowFlip, offset: offset2, disableRTL, resize, passThrough, open, scope } = props, [arrowEl, setArrow] = React4.useState(null), [arrowSize, setArrowSize] = React4.useState(0), offsetOptions = offset2 ?? arrowSize, floatingStyle = React4.useRef({}), floating = (0, import_floating.useFloating)({
-        open: passThrough ? !1 : open || !0,
+      var { children, size: size2, strategy = "absolute", placement = "bottom", stayInFrame, allowFlip, offset: offset2, disableRTL, resize, passThrough, open, scope } = props, [arrowEl, setArrow] = React4.useState(null), [arrowSize, setArrowSize] = React4.useState(0), offsetOptions = offset2 ?? arrowSize, floatingStyle = React4.useRef({}), isOpen = passThrough ? !1 : open || !0, floating = (0, import_floating.useFloating)({
+        open: isOpen,
         strategy,
         placement,
         sameScrollView: !1,
         // this only takes effect on native
-        whileElementsMounted: passThrough || !open ? void 0 : import_floating.autoUpdate,
+        whileElementsMounted: isOpen ? import_floating.autoUpdate : void 0,
         platform: disableRTL ?? setupOptions.disableRTL ? {
           ...import_floating.platform,
           isRTL(element) {
@@ -24542,10 +24568,13 @@ var require_Popper_native = __commonJS({
         JSON.stringify(middlewareData.arrow || null),
         floating.isPositioned
       ]);
-      return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(PopperProvider, {
-        scope,
-        ...popperContext,
-        children
+      return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core12.LayoutMeasurementController, {
+        disable: !isOpen,
+        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(PopperProvider, {
+          scope,
+          ...popperContext,
+          children
+        })
       });
     }
     var PopperAnchor = import_stacks3.YStack.extractable(/* @__PURE__ */ React4.forwardRef(function(props, forwardedRef) {