@tamagui/popper 2.7.7 → 3.0.0-beta.643.1

package/dist/cjs/Popper.native.js

@@ -1,5 +1,6 @@
 "use strict";
 
+
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -7,49 +8,42 @@ var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-// If the importer is in node compatibility mode or this is not an ESM
-// file that has been converted to a CommonJS file using a Babel-
-// compatible transform (i.e. "__esModule" has not been set), then set
-// "default" to the CommonJS "module.exports" for node compatibility.
-isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-  value: mod,
-  enumerable: true
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
 }) : target, mod));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var Popper_exports = {};
 __export(Popper_exports, {
-  Popper: () => Popper,
-  PopperAnchor: () => PopperAnchor,
-  PopperArrow: () => PopperArrow,
-  PopperArrowFrame: () => PopperArrowFrame,
-  PopperContent: () => PopperContent,
-  PopperContentFrame: () => PopperContentFrame,
-  PopperContextFast: () => PopperContextFast,
-  PopperContextSlow: () => PopperContextSlow,
-  PopperPositionContext: () => PopperPositionContext,
-  PopperProvider: () => PopperProvider,
-  PopperProviderFast: () => PopperProviderFast,
-  PopperProviderSlow: () => PopperProviderSlow,
-  setupPopper: () => setupPopper,
-  usePopperContext: () => usePopperContext,
-  usePopperContextSlow: () => usePopperContextSlow
+	Popper: () => Popper,
+	PopperAnchor: () => PopperAnchor,
+	PopperArrow: () => PopperArrow,
+	PopperArrowFrame: () => PopperArrowFrame,
+	PopperContent: () => PopperContent,
+	PopperContentFrame: () => PopperContentFrame,
+	PopperContextFast: () => PopperContextFast,
+	PopperContextSlow: () => PopperContextSlow,
+	PopperPositionContext: () => PopperPositionContext,
+	PopperProvider: () => PopperProvider,
+	PopperProviderFast: () => PopperProviderFast,
+	PopperProviderSlow: () => PopperProviderSlow,
+	setupPopper: () => setupPopper,
+	usePopperContext: () => usePopperContext,
+	usePopperContextSlow: () => usePopperContextSlow
 });
 module.exports = __toCommonJS(Popper_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -60,598 +54,482 @@ var import_core = require("@tamagui/core");
 var import_floating = require("@tamagui/floating");
 var import_floating2 = require("@tamagui/floating");
 var import_get_token = require("@tamagui/get-token");
-var import_stacks = require("@tamagui/stacks");
 var import_start_transition = require("@tamagui/start-transition");
 var React = __toESM(require("react"), 1);
 var import_react_native = require("react-native");
 function _instanceof(left, right) {
-  if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) return !!right[Symbol.hasInstance](left);else return left instanceof right;
+	if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) return !!right[Symbol.hasInstance](left);
+	else return left instanceof right;
 }
 function _type_of(obj) {
-  "@swc/helpers - typeof";
-
-  return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+	"@swc/helpers - typeof";
+	return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
 }
-var PopperContextFast = (0, import_core.createStyledContext)(
-// since we always provide this we can avoid setting here
-{}, "Popper__");
+var PopperContextFast = (0, import_core.createStyledContext)({}, "Popper__");
 var PopperPositionContext = import_core.createStyledContext;
-var {
-  useStyledContext: usePopperContext,
-  Provider: PopperProviderFast
-} = PopperContextFast;
-var PopperContextSlow = (0, import_core.createStyledContext)(
-// since we always provide this we can avoid setting here
-{}, "PopperSlow__");
-var {
-  useStyledContext: usePopperContextSlow,
-  Provider: PopperProviderSlow
-} = PopperContextSlow;
-var PopperProvider = function (param) {
-  var {
-    scope,
-    children,
-    ...context
-  } = param;
-  var fns = React.useRef(context);
-  fns.current = context;
-  var [slowContext] = React.useState(function () {
-    return {
-      refs: context.refs,
-      triggerElements: context.triggerElements,
-      update() {
-        for (var _len = arguments.length, a = new Array(_len), _key = 0; _key < _len; _key++) a[_key] = arguments[_key];
-        fns.current.update(...a);
-      },
-      getReferenceProps(p) {
-        var _fns_current_getReferenceProps, _fns_current;
-        return (_fns_current_getReferenceProps = (_fns_current = fns.current).getReferenceProps) === null || _fns_current_getReferenceProps === void 0 ? void 0 : _fns_current_getReferenceProps.call(_fns_current, p);
-      },
-      onHoverReference(e) {
-        var _fns_current_onHoverReference, _fns_current;
-        (_fns_current_onHoverReference = (_fns_current = fns.current).onHoverReference) === null || _fns_current_onHoverReference === void 0 || _fns_current_onHoverReference.call(_fns_current, e);
-      },
-      onLeaveReference() {
-        var _fns_current_onLeaveReference, _fns_current;
-        (_fns_current_onLeaveReference = (_fns_current = fns.current).onLeaveReference) === null || _fns_current_onLeaveReference === void 0 || _fns_current_onLeaveReference.call(_fns_current);
-      }
-    };
-  });
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperProviderFast, {
-    scope,
-    ...context,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperProviderSlow, {
-      scope,
-      ...slowContext,
-      children
-    })
-  });
+var { useStyledContext: usePopperContext, Provider: PopperProviderFast } = PopperContextFast;
+var PopperContextSlow = (0, import_core.createStyledContext)({}, "PopperSlow__");
+var { useStyledContext: usePopperContextSlow, Provider: PopperProviderSlow } = PopperContextSlow;
+var PopperProvider = function(param) {
+	var { scope, children, ...context } = param;
+	var fns = React.useRef(context);
+	fns.current = context;
+	var [slowContext] = React.useState(function() {
+		return {
+			refs: context.refs,
+			triggerElements: context.triggerElements,
+			update() {
+				for (var _len = arguments.length, a = new Array(_len), _key = 0; _key < _len; _key++) a[_key] = arguments[_key];
+				fns.current.update(...a);
+			},
+			getReferenceProps(p) {
+				var _fns_current_getReferenceProps, _fns_current;
+				return (_fns_current_getReferenceProps = (_fns_current = fns.current).getReferenceProps) === null || _fns_current_getReferenceProps === void 0 ? void 0 : _fns_current_getReferenceProps.call(_fns_current, p);
+			},
+			onHoverReference(e) {
+				var _fns_current_onHoverReference, _fns_current;
+				(_fns_current_onHoverReference = (_fns_current = fns.current).onHoverReference) === null || _fns_current_onHoverReference === void 0 || _fns_current_onHoverReference.call(_fns_current, e);
+			},
+			onLeaveReference() {
+				var _fns_current_onLeaveReference, _fns_current;
+				(_fns_current_onLeaveReference = (_fns_current = fns.current).onLeaveReference) === null || _fns_current_onLeaveReference === void 0 || _fns_current_onLeaveReference.call(_fns_current);
+			}
+		};
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProviderFast, {
+		scope,
+		...context,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProviderSlow, {
+			scope,
+			...slowContext,
+			children
+		})
+	});
 };
 var checkFloating = {
-  name: "checkFloating",
-  fn(data) {
-    return {
-      data: {
-        hasFloating: !!data.rects.floating.width
-      }
-    };
-  }
+	name: "checkFloating",
+	fn(data) {
+		return { data: { hasFloating: !!data.rects.floating.width } };
+	}
 };
 var setupOptions = {};
 function setupPopper(options) {
-  Object.assign(setupOptions, options);
+	Object.assign(setupOptions, options);
 }
 function tamaguiAutoUpdate(reference, floating, update) {
-  update();
-  var rafId = requestAnimationFrame(function () {
-    update();
-    rafId = 0;
-  });
-  var cleanups = [function () {
-    if (rafId) cancelAnimationFrame(rafId);
-  }];
-  if (_instanceof(reference, HTMLElement)) cleanups.push((0, import_core.registerLayoutNode)(reference, update));
-  if (typeof ResizeObserver !== "undefined") {
-    var lastWidth = -1;
-    var lastHeight = -1;
-    var ro = new ResizeObserver(function (entries) {
-      var entry = entries[entries.length - 1];
-      if (!entry) return;
-      var {
-        width,
-        height
-      } = entry.contentRect;
-      if (lastWidth === -1) {
-        lastWidth = width;
-        lastHeight = height;
-        return;
-      }
-      if (width !== lastWidth || height !== lastHeight) {
-        lastWidth = width;
-        lastHeight = height;
-        update();
-      }
-    });
-    ro.observe(floating);
-    cleanups.push(function () {
-      return ro.disconnect();
-    });
-  }
-  var ancestors = [...(_instanceof(reference, Element) ? (0, import_floating2.getOverflowAncestors)(reference) : []), ...(0, import_floating2.getOverflowAncestors)(floating)];
-  var uniqueAncestors = [...new Set(ancestors)];
-  var _iteratorNormalCompletion = true,
-    _didIteratorError = false,
-    _iteratorError = void 0;
-  try {
-    for (var _iterator = uniqueAncestors[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) _step.value.addEventListener("scroll", update, {
-      passive: true
-    });
-  } catch (err) {
-    _didIteratorError = true;
-    _iteratorError = err;
-  } finally {
-    try {
-      if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
-    } finally {
-      if (_didIteratorError) throw _iteratorError;
-    }
-  }
-  window.addEventListener("resize", update);
-  cleanups.push(function () {
-    var _iteratorNormalCompletion2 = true,
-      _didIteratorError2 = false,
-      _iteratorError2 = void 0;
-    try {
-      for (var _iterator2 = uniqueAncestors[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) _step2.value.removeEventListener("scroll", update);
-    } catch (err) {
-      _didIteratorError2 = true;
-      _iteratorError2 = err;
-    } finally {
-      try {
-        if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
-      } finally {
-        if (_didIteratorError2) throw _iteratorError2;
-      }
-    }
-    window.removeEventListener("resize", update);
-  });
-  return function () {
-    return cleanups.forEach(function (fn) {
-      return fn();
-    });
-  };
+	update();
+	var rafId = requestAnimationFrame(function() {
+		update();
+		rafId = 0;
+	});
+	var cleanups = [function() {
+		if (rafId) cancelAnimationFrame(rafId);
+	}];
+	if (_instanceof(reference, HTMLElement)) cleanups.push((0, import_core.registerLayoutNode)(reference, update));
+	if (typeof ResizeObserver !== "undefined") {
+		var lastWidth = -1;
+		var lastHeight = -1;
+		var ro = new ResizeObserver(function(entries) {
+			var entry = entries[entries.length - 1];
+			if (!entry) return;
+			var { width, height } = entry.contentRect;
+			if (lastWidth === -1) {
+				lastWidth = width;
+				lastHeight = height;
+				return;
+			}
+			if (width !== lastWidth || height !== lastHeight) {
+				lastWidth = width;
+				lastHeight = height;
+				update();
+			}
+		});
+		ro.observe(floating);
+		cleanups.push(function() {
+			return ro.disconnect();
+		});
+	}
+	var ancestors = [..._instanceof(reference, Element) ? (0, import_floating2.getOverflowAncestors)(reference) : [], ...(0, import_floating2.getOverflowAncestors)(floating)];
+	var uniqueAncestors = [...new Set(ancestors)];
+	var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
+	try {
+		for (var _iterator = uniqueAncestors[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) _step.value.addEventListener("scroll", update, { passive: true });
+	} catch (err) {
+		_didIteratorError = true;
+		_iteratorError = err;
+	} finally {
+		try {
+			if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
+		} finally {
+			if (_didIteratorError) throw _iteratorError;
+		}
+	}
+	window.addEventListener("resize", update);
+	cleanups.push(function() {
+		var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+		try {
+			for (var _iterator2 = uniqueAncestors[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) _step2.value.removeEventListener("scroll", update);
+		} catch (err) {
+			_didIteratorError2 = true;
+			_iteratorError2 = err;
+		} finally {
+			try {
+				if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+			} finally {
+				if (_didIteratorError2) throw _iteratorError2;
+			}
+		}
+		window.removeEventListener("resize", update);
+	});
+	return function() {
+		return cleanups.forEach(function(fn) {
+			return fn();
+		});
+	};
 }
 function Popper(props) {
-  var {
-    children,
-    size,
-    strategy = "absolute",
-    placement = "bottom",
-    stayInFrame,
-    allowFlip,
-    offset,
-    disableRTL,
-    resize,
-    passThrough,
-    open,
-    scope
-  } = props;
-  var [arrowEl, setArrow] = React.useState(null);
-  var [arrowSize, setArrowSize] = React.useState(0);
-  var offsetOptions = offset !== null && offset !== void 0 ? offset : arrowSize;
-  React.useRef({});
-  var isOpen = passThrough ? false : open !== null && open !== void 0 ? open : true;
-  var middlewareRef = React.useRef([]);
-  if (isOpen) middlewareRef.current = [typeof offsetOptions !== "undefined" ? (0, import_floating2.offset)(offsetOptions) : null, allowFlip ? (0, import_floating2.flip)(typeof allowFlip === "boolean" ? {} : allowFlip) : null, stayInFrame ? (0, import_floating2.shift)({
-    padding: 10,
-    mainAxis: true,
-    crossAxis: false,
-    ...((typeof stayInFrame === "undefined" ? "undefined" : _type_of(stayInFrame)) === "object" ? stayInFrame : null)
-  }) : null, arrowEl ? (0, import_floating2.arrow)({
-    element: arrowEl
-  }) : null, checkFloating, null, null, null].filter(Boolean);
-  var floating = (0, import_floating2.useFloating)({
-    open: isOpen,
-    strategy,
-    placement,
-    sameScrollView: false,
-    whileElementsMounted: !isOpen ? void 0 : tamaguiAutoUpdate,
-    platform: (disableRTL !== null && disableRTL !== void 0 ? disableRTL : setupOptions.disableRTL) ? {
-      ...import_floating2.platform,
-      isRTL(element) {
-        return false;
-      }
-    } : import_floating2.platform,
-    middleware: middlewareRef.current
-  });
-  var {
-    middlewareData
-  } = floating;
-  var dimensions = (0, import_react_native.useWindowDimensions)();
-  var [keyboardOpen, setKeyboardOpen] = React.useState(false);
-  React.useEffect(function () {
-    var showSubscription = import_react_native.Keyboard.addListener("keyboardDidShow", function () {
-      (0, import_start_transition.startTransition)(function () {
-        setKeyboardOpen(true);
-      });
-    });
-    var hideSubscription = import_react_native.Keyboard.addListener("keyboardDidHide", function () {
-      (0, import_start_transition.startTransition)(function () {
-        setKeyboardOpen(false);
-      });
-    });
-    return function () {
-      showSubscription.remove();
-      hideSubscription.remove();
-    };
-  }, []);
-  (0, import_constants.useIsomorphicLayoutEffect)(function () {
-    if (passThrough) return;
-    floating.update();
-  }, [passThrough, dimensions, keyboardOpen]);
-  var popperContext = React.useMemo(function () {
-    var _middlewareData_checkFloating;
-    return {
-      size,
-      arrowRef: setArrow,
-      arrowStyle: middlewareData.arrow,
-      onArrowSize: setArrowSize,
-      hasFloating: (_middlewareData_checkFloating = middlewareData.checkFloating) === null || _middlewareData_checkFloating === void 0 ? void 0 : _middlewareData_checkFloating.hasFloating,
-      transformOrigin: middlewareData.transformOrigin,
-      open: !!open,
-      ...floating
-    };
-  }, [open, size, floating, JSON.stringify(middlewareData.arrow || null), JSON.stringify(middlewareData.transformOrigin || null)]);
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperProvider, {
-    scope,
-    ...popperContext,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_floating.FloatingOverrideContext.Provider, {
-      value: null,
-      children
-    })
-  });
+	var { children, size, strategy = "absolute", placement = "bottom", stayInFrame, allowFlip, offset, disableRTL, resize, passThrough, open, scope } = props;
+	var [arrowEl, setArrow] = React.useState(null);
+	var [arrowSize, setArrowSize] = React.useState(0);
+	var offsetOptions = offset !== null && offset !== void 0 ? offset : arrowSize;
+	React.useRef({});
+	var isOpen = passThrough ? false : open !== null && open !== void 0 ? open : true;
+	var middlewareRef = React.useRef([]);
+	if (isOpen) middlewareRef.current = [
+		typeof offsetOptions !== "undefined" ? (0, import_floating2.offset)(offsetOptions) : null,
+		allowFlip ? (0, import_floating2.flip)(typeof allowFlip === "boolean" ? {} : allowFlip) : null,
+		stayInFrame ? (0, import_floating2.shift)({
+			padding: 10,
+			mainAxis: true,
+			crossAxis: false,
+			...(typeof stayInFrame === "undefined" ? "undefined" : _type_of(stayInFrame)) === "object" ? stayInFrame : null
+		}) : null,
+		arrowEl ? (0, import_floating2.arrow)({ element: arrowEl }) : null,
+		checkFloating,
+		null,
+		null,
+		null
+	].filter(Boolean);
+	var floating = (0, import_floating2.useFloating)({
+		open: isOpen,
+		strategy,
+		placement,
+		sameScrollView: false,
+		whileElementsMounted: !isOpen ? void 0 : tamaguiAutoUpdate,
+		platform: (disableRTL !== null && disableRTL !== void 0 ? disableRTL : setupOptions.disableRTL) ? {
+			...import_floating2.platform,
+			isRTL(element) {
+				return false;
+			}
+		} : import_floating2.platform,
+		middleware: middlewareRef.current
+	});
+	var { middlewareData } = floating;
+	var dimensions = (0, import_react_native.useWindowDimensions)();
+	var [keyboardOpen, setKeyboardOpen] = React.useState(false);
+	React.useEffect(function() {
+		var showSubscription = import_react_native.Keyboard.addListener("keyboardDidShow", function() {
+			(0, import_start_transition.startTransition)(function() {
+				setKeyboardOpen(true);
+			});
+		});
+		var hideSubscription = import_react_native.Keyboard.addListener("keyboardDidHide", function() {
+			(0, import_start_transition.startTransition)(function() {
+				setKeyboardOpen(false);
+			});
+		});
+		return function() {
+			showSubscription.remove();
+			hideSubscription.remove();
+		};
+	}, []);
+	(0, import_constants.useIsomorphicLayoutEffect)(function() {
+		if (passThrough) return;
+		floating.update();
+	}, [
+		passThrough,
+		dimensions,
+		keyboardOpen
+	]);
+	var popperContext = React.useMemo(function() {
+		var _middlewareData_checkFloating;
+		return {
+			size,
+			arrowRef: setArrow,
+			arrowStyle: middlewareData.arrow,
+			onArrowSize: setArrowSize,
+			hasFloating: (_middlewareData_checkFloating = middlewareData.checkFloating) === null || _middlewareData_checkFloating === void 0 ? void 0 : _middlewareData_checkFloating.hasFloating,
+			transformOrigin: middlewareData.transformOrigin,
+			open: !!open,
+			...floating
+		};
+	}, [
+		open,
+		size,
+		floating,
+		JSON.stringify(middlewareData.arrow || null),
+		JSON.stringify(middlewareData.transformOrigin || null)
+	]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProvider, {
+		scope,
+		...popperContext,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_floating.FloatingOverrideContext.Provider, {
+			value: null,
+			children
+		})
+	});
 }
-var PopperAnchor = import_stacks.YStack.styleable(function PopperAnchor2(props, forwardedRef) {
-  var {
-    virtualRef,
-    scope,
-    ...rest
-  } = props;
-  var context = usePopperContextSlow(scope);
-  var {
-    getReferenceProps,
-    refs,
-    update
-  } = context;
-  var ref = React.useRef(null);
-  var triggerId = React.useId();
-  React.useEffect(function () {
-    if (!scope || !context.triggerElements || !ref.current) return;
-    if (!_instanceof(ref.current, Element)) return;
-    var el = ref.current;
-    context.triggerElements.add(triggerId, el);
-    return function () {
-      var _context_triggerElements;
-      (_context_triggerElements = context.triggerElements) === null || _context_triggerElements === void 0 || _context_triggerElements.delete(triggerId);
-    };
-  }, [scope, triggerId, context.triggerElements]);
-  React.useEffect(function () {
-    if (virtualRef) {
-      refs.setReference(virtualRef.current);
-      update();
-    }
-  }, [virtualRef]);
-  var refProps = (getReferenceProps === null || getReferenceProps === void 0 ? void 0 : getReferenceProps({
-    ...rest,
-    ref
-  })) || null;
-  var safeSetReference = React.useCallback(function (node) {
-    (0, import_start_transition.startTransition)(function () {
-      refs.setReference(node);
-    });
-  },
-  // it was refs.setRefernce but its stable and refs is undefined on server
-  [refs]);
-  var shouldHandleInHover = import_constants.isWeb && scope;
-  var composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, ref,
-  // web handles this onMouseEnter below so it can support multiple targets + hovering
-  shouldHandleInHover ? void 0 : safeSetReference);
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_core.View, {
-    ...rest,
-    ...refProps,
-    ref: composedRefs,
-    ...(shouldHandleInHover && {
-      onMouseEnter: function (e) {
-        var _e_currentTarget;
-        var el = (_e_currentTarget = e.currentTarget) !== null && _e_currentTarget !== void 0 ? _e_currentTarget : ref.current;
-        if (_instanceof(el, HTMLElement)) {
-          var _refProps_onPointerEnter, _context_onHoverReference;
-          (0, import_react_dom.flushSync)(function () {
-            return refs.setReference(el);
-          });
-          update();
-          if (!refProps) return;
-          (_refProps_onPointerEnter = refProps.onPointerEnter) === null || _refProps_onPointerEnter === void 0 || _refProps_onPointerEnter.call(refProps, e);
-          (_context_onHoverReference = context.onHoverReference) === null || _context_onHoverReference === void 0 || _context_onHoverReference.call(context, e.nativeEvent);
-        }
-      },
-      onMouseLeave: function (e) {
-        var _context_onLeaveReference, _refProps_onMouseLeave;
-        (_context_onLeaveReference = context.onLeaveReference) === null || _context_onLeaveReference === void 0 || _context_onLeaveReference.call(context);
-        refProps === null || refProps === void 0 || (_refProps_onMouseLeave = refProps.onMouseLeave) == null || _refProps_onMouseLeave.call(refProps, e);
-      }
-    })
-  });
+var PopperAnchor = (0, import_core.createStyledHOC)(import_core.View, function PopperAnchor2(props, forwardedRef) {
+	var { virtualRef, scope, ...rest } = props;
+	var context = usePopperContextSlow(scope);
+	var { getReferenceProps, refs, update } = context;
+	var ref = React.useRef(null);
+	var triggerId = React.useId();
+	React.useEffect(function() {
+		if (!scope || !context.triggerElements || !ref.current) return;
+		if (!_instanceof(ref.current, Element)) return;
+		var el = ref.current;
+		context.triggerElements.add(triggerId, el);
+		return function() {
+			var _context_triggerElements;
+			(_context_triggerElements = context.triggerElements) === null || _context_triggerElements === void 0 || _context_triggerElements.delete(triggerId);
+		};
+	}, [
+		scope,
+		triggerId,
+		context.triggerElements
+	]);
+	React.useEffect(function() {
+		if (virtualRef) {
+			refs.setReference(virtualRef.current);
+			update();
+		}
+	}, [virtualRef]);
+	var refProps = (getReferenceProps === null || getReferenceProps === void 0 ? void 0 : getReferenceProps({
+		...rest,
+		ref
+	})) || null;
+	var safeSetReference = React.useCallback(function(node) {
+		(0, import_start_transition.startTransition)(function() {
+			refs.setReference(node);
+		});
+	}, [refs]);
+	var shouldHandleInHover = import_constants.isWeb && scope;
+	var composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, ref, shouldHandleInHover ? void 0 : safeSetReference);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.View, {
+		...rest,
+		...refProps,
+		ref: composedRefs,
+		...shouldHandleInHover && {
+			onMouseEnter: function(e) {
+				var _e_currentTarget;
+				var el = (_e_currentTarget = e.currentTarget) !== null && _e_currentTarget !== void 0 ? _e_currentTarget : ref.current;
+				if (_instanceof(el, HTMLElement)) {
+					var _refProps_onPointerEnter, _context_onHoverReference;
+					(0, import_react_dom.flushSync)(function() {
+						return refs.setReference(el);
+					});
+					update();
+					if (!refProps) return;
+					(_refProps_onPointerEnter = refProps.onPointerEnter) === null || _refProps_onPointerEnter === void 0 || _refProps_onPointerEnter.call(refProps, e);
+					(_context_onHoverReference = context.onHoverReference) === null || _context_onHoverReference === void 0 || _context_onHoverReference.call(context, e.nativeEvent);
+				}
+			},
+			onMouseLeave: function(e) {
+				var _context_onLeaveReference, _refProps_onMouseLeave;
+				(_context_onLeaveReference = context.onLeaveReference) === null || _context_onLeaveReference === void 0 || _context_onLeaveReference.call(context);
+				refProps === null || refProps === void 0 || (_refProps_onMouseLeave = refProps.onMouseLeave) == null || _refProps_onMouseLeave.call(refProps, e);
+			}
+		}
+	});
 });
-var PopperContentFrame = (0, import_core.styled)(import_stacks.YStack, {
-  name: "PopperContent",
-  variants: {
-    unstyled: {
-      true: {}
-    },
-    size: {
-      "...size": function (val, param) {
-        var {
-          tokens
-        } = param;
-        return {
-          padding: tokens.space[val],
-          borderRadius: tokens.radius[val]
-        };
-      }
-    }
-  }
+var PopperContentFrame = (0, import_core.styled)(import_core.View, { displayName: "PopperContent" });
+var PopperContent = (0, import_core.createRefComponent)(function PopperContent2(props, forwardedRef) {
+	var isAnimatePosControlled = "animatePosition" in props;
+	var { scope, animatePosition, children, passThrough, ...rest } = props;
+	var animatePos = animatePosition;
+	var context = usePopperContext(scope);
+	var { strategy, placement, refs, x, y, getFloatingProps, isPositioned, transformOrigin, update } = context;
+	var updateRef = React.useRef(update);
+	updateRef.current = update;
+	var lastNodeRef = React.useRef(null);
+	var safeSetFloating = React.useCallback(function(node) {
+		var isNewNode = node !== lastNodeRef.current;
+		if (node) {
+			lastNodeRef.current = node;
+			refs.setFloating(node);
+			if (!isNewNode) {
+				var _updateRef_current;
+				(_updateRef_current = updateRef.current) === null || _updateRef_current === void 0 || _updateRef_current.call(updateRef);
+			}
+		}
+	}, [refs.setFloating]);
+	React.useEffect(function() {
+		return function() {
+			var ourNode = lastNodeRef.current;
+			if (ourNode && refs.floating.current === ourNode) refs.setFloating(null);
+			lastNodeRef.current = null;
+		};
+	}, []);
+	var contentRefs = (0, import_compose_refs.useComposedRefs)(safeSetFloating, forwardedRef);
+	var [needsMeasure, setNeedsMeasure] = React.useState(animatePos);
+	(0, import_constants.useIsomorphicLayoutEffect)(function() {
+		if (needsMeasure && x && y) setNeedsMeasure(false);
+	}, [
+		needsMeasure,
+		animatePos,
+		x,
+		y
+	]);
+	var hasBeenPositioned = React.useRef(false);
+	var lastGoodPosition = React.useRef({
+		x: 0,
+		y: 0
+	});
+	if (x !== 0 || y !== 0) {
+		lastGoodPosition.current = {
+			x,
+			y
+		};
+		if (isPositioned) hasBeenPositioned.current = true;
+	}
+	var brieflyZero = hasBeenPositioned.current && x === 0 && y === 0;
+	var effectiveX = brieflyZero ? lastGoodPosition.current.x : x;
+	var effectiveY = brieflyZero ? lastGoodPosition.current.y : y;
+	var hide = !hasBeenPositioned.current && effectiveX === 0 && effectiveY === 0;
+	var disableAnimationProp = animatePos === "even-when-repositioning" ? needsMeasure : !hasBeenPositioned.current && !isPositioned || needsMeasure;
+	var [disableAnimation, setDisableAnimation] = React.useState(disableAnimationProp);
+	React.useEffect(function() {
+		setDisableAnimation(disableAnimationProp);
+	}, [disableAnimationProp]);
+	var frameProps = {
+		ref: contentRefs,
+		...hide ? {} : {
+			x: effectiveX || 0,
+			y: effectiveY || 0
+		},
+		top: 0,
+		left: 0,
+		position: strategy,
+		opacity: hide ? 0 : 1,
+		...isAnimatePosControlled && {
+			transition: animatePos ? rest.transition : void 0,
+			animateOnly: animatePos && !disableAnimation ? rest.animateOnly : [],
+			animatePresence: false
+		}
+	};
+	var { style, ...floatingProps } = getFloatingProps ? getFloatingProps(frameProps) : frameProps;
+	var transformOriginStyle = import_constants.isWeb && transformOrigin ? { transformOrigin: `${transformOrigin.x} ${transformOrigin.y}` } : void 0;
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.LayoutMeasurementController, {
+		disable: !context.open,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.View, {
+			passThrough,
+			ref: contentRefs,
+			direction: rest.direction,
+			...passThrough ? null : floatingProps,
+			...!passThrough && animatePos && { "data-popper-animate-position": "true" },
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperContentFrame, {
+				passThrough,
+				...!passThrough && {
+					"data-placement": placement,
+					"data-strategy": strategy,
+					...style,
+					...transformOriginStyle,
+					...rest
+				},
+				children
+			}, "popper-content-frame")
+		})
+	});
 });
-var PopperContent = /* @__PURE__ */React.forwardRef(function PopperContent2(props, forwardedRef) {
-  var isAnimatePosControlled = "animatePosition" in props || "enableAnimationForPositionChange" in props;
-  var {
-    scope,
-    animatePosition,
-    enableAnimationForPositionChange,
-    children,
-    passThrough,
-    unstyled,
-    ...rest
-  } = props;
-  var animatePos = animatePosition !== null && animatePosition !== void 0 ? animatePosition : enableAnimationForPositionChange;
-  var context = usePopperContext(scope);
-  var {
-    strategy,
-    placement,
-    refs,
-    x,
-    y,
-    getFloatingProps,
-    size,
-    isPositioned,
-    transformOrigin,
-    update
-  } = context;
-  var updateRef = React.useRef(update);
-  updateRef.current = update;
-  var lastNodeRef = React.useRef(null);
-  var safeSetFloating = React.useCallback(function (node) {
-    var isNewNode = node !== lastNodeRef.current;
-    if (node) {
-      lastNodeRef.current = node;
-      refs.setFloating(node);
-      if (!isNewNode) {
-        var _updateRef_current;
-        (_updateRef_current = updateRef.current) === null || _updateRef_current === void 0 || _updateRef_current.call(updateRef);
-      }
-    }
-  },
-  // null calls are blocked: cycling nulls are transient, genuine unmount
-  // is handled by the useEffect cleanup below
-  [refs.setFloating]);
-  React.useEffect(function () {
-    return function () {
-      var ourNode = lastNodeRef.current;
-      if (ourNode && refs.floating.current === ourNode) refs.setFloating(null);
-      lastNodeRef.current = null;
-    };
-  }, []);
-  var contentRefs = (0, import_compose_refs.useComposedRefs)(safeSetFloating, forwardedRef);
-  var [needsMeasure, setNeedsMeasure] = React.useState(animatePos);
-  (0, import_constants.useIsomorphicLayoutEffect)(function () {
-    if (needsMeasure && x && y) setNeedsMeasure(false);
-  }, [needsMeasure, animatePos, x, y]);
-  var hasBeenPositioned = React.useRef(false);
-  var lastGoodPosition = React.useRef({
-    x: 0,
-    y: 0
-  });
-  if (x !== 0 || y !== 0) {
-    lastGoodPosition.current = {
-      x,
-      y
-    };
-    if (isPositioned) hasBeenPositioned.current = true;
-  }
-  var brieflyZero = hasBeenPositioned.current && x === 0 && y === 0;
-  var effectiveX = brieflyZero ? lastGoodPosition.current.x : x;
-  var effectiveY = brieflyZero ? lastGoodPosition.current.y : y;
-  var hide = !hasBeenPositioned.current && effectiveX === 0 && effectiveY === 0;
-  var disableAnimationProp = animatePos === "even-when-repositioning" ? needsMeasure : !hasBeenPositioned.current && !isPositioned || needsMeasure;
-  var [disableAnimation, setDisableAnimation] = React.useState(disableAnimationProp);
-  React.useEffect(function () {
-    setDisableAnimation(disableAnimationProp);
-  }, [disableAnimationProp]);
-  var frameProps = {
-    ref: contentRefs,
-    ...(hide ? {} :
-    // omit x/y when hiding - prevents motion driver from animating from origin
-    {
-      x: effectiveX || 0,
-      y: effectiveY || 0
-    }),
-    top: 0,
-    left: 0,
-    position: strategy,
-    opacity: hide ? 0 : 1,
-    ...(isAnimatePosControlled && {
-      transition: animatePos ? rest.transition : void 0,
-      animateOnly: animatePos && !disableAnimation ? rest.animateOnly : [],
-      animatePresence: false
-    })
-  };
-  var {
-    style,
-    ...floatingProps
-  } = getFloatingProps ? getFloatingProps(frameProps) : frameProps;
-  var transformOriginStyle = import_constants.isWeb && transformOrigin ? {
-    transformOrigin: `${transformOrigin.x} ${transformOrigin.y}`
-  } : void 0;
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_core.LayoutMeasurementController, {
-    disable: !context.open,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_core.View, {
-      passThrough,
-      ref: contentRefs,
-      direction: rest.direction,
-      ...(passThrough ? null : floatingProps),
-      ...(!passThrough && animatePos && {
-        "data-popper-animate-position": "true"
-      }),
-      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperContentFrame, {
-        passThrough,
-        unstyled,
-        ...(!passThrough && {
-          "data-placement": placement,
-          "data-strategy": strategy,
-          size,
-          ...style,
-          ...transformOriginStyle,
-          ...rest
-        }),
-        children
-      }, "popper-content-frame")
-    })
-  });
+var PopperArrowFrame = (0, import_core.styled)(import_core.View, {
+	displayName: "PopperArrow",
+	position: "relative"
 });
-var PopperArrowFrame = (0, import_core.styled)(import_stacks.YStack, {
-  name: "PopperArrow",
-  variants: {
-    unstyled: {
-      false: {
-        borderColor: "$borderColor",
-        backgroundColor: "$background",
-        position: "relative"
-      }
-    }
-  },
-  defaultVariants: {
-    unstyled: process.env.TAMAGUI_HEADLESS === "1"
-  }
-});
-var PopperArrowOuterFrame = (0, import_core.styled)(import_stacks.YStack, {
-  name: "PopperArrowOuter",
-  variants: {
-    unstyled: {
-      false: {
-        position: "absolute",
-        zIndex: 1e6,
-        pointerEvents: "none",
-        overflow: "hidden",
-        alignItems: "center",
-        justifyContent: "center"
-      }
-    }
-  },
-  defaultVariants: {
-    unstyled: process.env.TAMAGUI_HEADLESS === "1"
-  }
+var PopperArrowOuterFrame = (0, import_core.styled)(import_core.View, {
+	displayName: "PopperArrowOuter",
+	position: "absolute",
+	zIndex: 1e6,
+	pointerEvents: "none",
+	overflow: "hidden",
+	alignItems: "center",
+	justifyContent: "center"
 });
 var opposites = {
-  top: "bottom",
-  right: "left",
-  bottom: "top",
-  left: "right"
+	top: "bottom",
+	right: "left",
+	bottom: "top",
+	left: "right"
 };
-var PopperArrow = /* @__PURE__ */React.forwardRef(function PopperArrow2(propsIn, forwardedRef) {
-  var _context_arrowStyle, _context_arrowStyle1;
-  var isAnimatePosControlled = "animatePosition" in propsIn;
-  var {
-    scope,
-    animatePosition,
-    transition,
-    ...rest
-  } = propsIn;
-  var {
-    offset,
-    size: sizeProp,
-    borderWidth = 0,
-    ...arrowProps
-  } = rest;
-  var context = usePopperContext(scope);
-  var sizeVal = typeof sizeProp === "number" ? sizeProp : (0, import_core.getVariableValue)((0, import_get_token.getSpace)(sizeProp !== null && sizeProp !== void 0 ? sizeProp : context.size, {
-    shift: -2,
-    bounds: [2]
-  }));
-  var size = Math.max(0, +sizeVal);
-  var {
-    placement
-  } = context;
-  var refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef);
-  var x = ((_context_arrowStyle = context.arrowStyle) === null || _context_arrowStyle === void 0 ? void 0 : _context_arrowStyle.x) || 0;
-  var y = ((_context_arrowStyle1 = context.arrowStyle) === null || _context_arrowStyle1 === void 0 ? void 0 : _context_arrowStyle1.y) || 0;
-  var arrowPositioned = context.arrowStyle != null;
-  var primaryPlacement = placement ? placement.split("-")[0] : "top";
-  var arrowStyle = {
-    x,
-    y,
-    width: size,
-    height: size
-  };
-  var innerArrowStyle = {};
-  var isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
-  if (primaryPlacement) {
-    arrowStyle[isVertical ? "width" : "height"] = size * 2;
-    var oppSide = opposites[primaryPlacement];
-    if (oppSide) {
-      arrowStyle[oppSide] = -size;
-      innerArrowStyle[oppSide] = size / 2;
-    }
-    if (oppSide === "top" || oppSide === "bottom") arrowStyle.left = 0;
-    if (oppSide === "left" || oppSide === "right") arrowStyle.top = 0;
-    (0, import_constants.useIsomorphicLayoutEffect)(function () {
-      var _context_onArrowSize;
-      (_context_onArrowSize = context.onArrowSize) === null || _context_onArrowSize === void 0 || _context_onArrowSize.call(context, size);
-    }, [size, context.onArrowSize]);
-  }
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperArrowOuterFrame, {
-    ref: refs,
-    ...arrowStyle,
-    ...(!arrowPositioned && {
-      opacity: 0
-    }),
-    ...(isAnimatePosControlled && {
-      transition: animatePosition ? transition : void 0,
-      animateOnly: animatePosition ? ["transform"] : [],
-      animatePresence: false
-    }),
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(PopperArrowFrame, {
-      width: size,
-      height: size,
-      ...arrowProps,
-      ...innerArrowStyle,
-      rotate: "45deg",
-      ...(primaryPlacement === "bottom" && {
-        borderLeftWidth: borderWidth,
-        borderTopWidth: borderWidth
-      }),
-      ...(primaryPlacement === "top" && {
-        borderBottomWidth: borderWidth,
-        borderRightWidth: borderWidth
-      }),
-      ...(primaryPlacement === "right" && {
-        borderLeftWidth: borderWidth,
-        borderBottomWidth: borderWidth
-      }),
-      ...(primaryPlacement === "left" && {
-        borderTopWidth: borderWidth,
-        borderRightWidth: borderWidth
-      })
-    })
-  });
+var PopperArrow = (0, import_core.createRefComponent)(function PopperArrow2(propsIn, forwardedRef) {
+	var _context_arrowStyle, _context_arrowStyle1;
+	var isAnimatePosControlled = "animatePosition" in propsIn;
+	var { scope, animatePosition, transition, ...rest } = propsIn;
+	var { offset, size: sizeProp, borderWidth = 0, ...arrowProps } = rest;
+	var context = usePopperContext(scope);
+	var sizeVal = typeof sizeProp === "number" ? sizeProp : (0, import_core.getVariableValue)((0, import_get_token.getSize)(sizeProp !== null && sizeProp !== void 0 ? sizeProp : context.size)) * .52 - 11.5;
+	var size = Math.max(0, +sizeVal);
+	var { placement } = context;
+	var refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef);
+	var x = ((_context_arrowStyle = context.arrowStyle) === null || _context_arrowStyle === void 0 ? void 0 : _context_arrowStyle.x) || 0;
+	var y = ((_context_arrowStyle1 = context.arrowStyle) === null || _context_arrowStyle1 === void 0 ? void 0 : _context_arrowStyle1.y) || 0;
+	var arrowPositioned = context.arrowStyle != null;
+	var primaryPlacement = placement ? placement.split("-")[0] : "top";
+	var arrowStyle = {
+		x,
+		y,
+		width: size,
+		height: size
+	};
+	var innerArrowStyle = {};
+	var isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
+	if (primaryPlacement) {
+		arrowStyle[isVertical ? "width" : "height"] = size * 2;
+		var oppSide = opposites[primaryPlacement];
+		if (oppSide) {
+			arrowStyle[oppSide] = -size;
+			innerArrowStyle[oppSide] = size / 2;
+		}
+		if (oppSide === "top" || oppSide === "bottom") arrowStyle.left = 0;
+		if (oppSide === "left" || oppSide === "right") arrowStyle.top = 0;
+		(0, import_constants.useIsomorphicLayoutEffect)(function() {
+			var _context_onArrowSize;
+			(_context_onArrowSize = context.onArrowSize) === null || _context_onArrowSize === void 0 || _context_onArrowSize.call(context, size);
+		}, [size, context.onArrowSize]);
+	}
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperArrowOuterFrame, {
+		ref: refs,
+		...arrowStyle,
+		...!arrowPositioned && { opacity: 0 },
+		...isAnimatePosControlled && {
+			transition: animatePosition ? transition : void 0,
+			animateOnly: animatePosition ? ["transform"] : [],
+			animatePresence: false
+		},
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperArrowFrame, {
+			width: size,
+			height: size,
+			...arrowProps,
+			...innerArrowStyle,
+			rotate: "45deg",
+			...primaryPlacement === "bottom" && {
+				borderLeftWidth: borderWidth,
+				borderTopWidth: borderWidth
+			},
+			...primaryPlacement === "top" && {
+				borderBottomWidth: borderWidth,
+				borderRightWidth: borderWidth
+			},
+			...primaryPlacement === "right" && {
+				borderLeftWidth: borderWidth,
+				borderBottomWidth: borderWidth
+			},
+			...primaryPlacement === "left" && {
+				borderTopWidth: borderWidth,
+				borderRightWidth: borderWidth
+			}
+		})
+	});
 });
+
 //# sourceMappingURL=Popper.native.js.map