@tamagui/popper 1.116.0 → 1.116.2

package/dist/cjs/Popper.js

@@ -0,0 +1,265 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: !0 });
+}, __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__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: !0 }) : target,
+  mod
+)), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var Popper_exports = {};
+__export(Popper_exports, {
+  Popper: () => Popper,
+  PopperAnchor: () => PopperAnchor,
+  PopperArrow: () => PopperArrow,
+  PopperContent: () => PopperContent,
+  PopperContentFrame: () => PopperContentFrame,
+  PopperContext: () => PopperContext,
+  PopperProvider: () => PopperProvider,
+  setupPopper: () => setupPopper,
+  usePopperContext: () => usePopperContext
+});
+module.exports = __toCommonJS(Popper_exports);
+var import_compose_refs = require("@tamagui/compose-refs"), import_constants = require("@tamagui/constants"), import_core = require("@tamagui/core"), import_floating = require("@tamagui/floating"), import_get_token = require("@tamagui/get-token"), import_stacks = require("@tamagui/stacks"), import_start_transition = require("@tamagui/start-transition"), React = __toESM(require("react")), import_react_native = require("react-native-web"), import_jsx_runtime = require("react/jsx-runtime");
+const PopperContext = (0, import_core.createStyledContext)({}), { useStyledContext: usePopperContext, Provider: PopperProvider } = PopperContext, checkFloating = void 0, setupOptions = {};
+function setupPopper(options) {
+  Object.assign(setupOptions, options);
+}
+function Popper(props) {
+  const {
+    children,
+    size,
+    strategy = "absolute",
+    placement = "bottom",
+    stayInFrame,
+    allowFlip,
+    offset,
+    disableRTL,
+    __scopePopper
+  } = props, [arrowEl, setArrow] = React.useState(null), [arrowSize, setArrowSize] = React.useState(0), offsetOptions = offset ?? arrowSize, floating = (0, import_floating.useFloating)({
+    strategy,
+    placement,
+    sameScrollView: !1,
+    // this only takes effect on native
+    platform: disableRTL ?? setupOptions.disableRTL ? {
+      ...import_floating.platform,
+      isRTL(element) {
+        return !1;
+      }
+    } : import_floating.platform,
+    middleware: [
+      stayInFrame ? (0, import_floating.shift)(typeof stayInFrame == "boolean" ? {} : stayInFrame) : null,
+      allowFlip ? (0, import_floating.flip)(typeof allowFlip == "boolean" ? {} : allowFlip) : null,
+      arrowEl ? (0, import_floating.arrow)({ element: arrowEl }) : null,
+      typeof offsetOptions < "u" ? (0, import_floating.offset)(offsetOptions) : null,
+      checkFloating
+    ].filter(Boolean)
+  }), {
+    refs,
+    middlewareData,
+    // @ts-expect-error this comes from Tooltip for example
+    open
+  } = floating;
+  (0, import_constants.useIsomorphicLayoutEffect)(() => {
+    if (open && refs.reference.current && refs.floating.current)
+      return floating.update(), (0, import_floating.autoUpdate)(refs.reference.current, refs.floating.current, floating.update);
+  }, [open, floating.update, refs.floating, refs.reference]);
+  const popperContext = {
+    size,
+    arrowRef: setArrow,
+    arrowStyle: middlewareData.arrow,
+    onArrowSize: setArrowSize,
+    scope: __scopePopper,
+    hasFloating: middlewareData.checkFloating?.hasFloating,
+    ...floating
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProvider, { ...popperContext, children });
+}
+const PopperAnchor = import_stacks.YStack.extractable(
+  React.forwardRef(
+    function(props, forwardedRef) {
+      const { virtualRef, __scopePopper, ...anchorProps } = props, { getReferenceProps, refs } = usePopperContext(__scopePopper), ref = React.useRef(null), composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, ref, refs.setReference);
+      React.useEffect(() => {
+        virtualRef && refs.setReference(virtualRef.current);
+      }, [virtualRef]);
+      const stackProps = {
+        ref: composedRefs,
+        ...anchorProps
+      };
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_core.View,
+        {
+          ...getReferenceProps ? getReferenceProps(stackProps) : stackProps
+        }
+      );
+    }
+  )
+), PopperContentFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
+  name: "PopperContent",
+  variants: {
+    unstyled: {
+      false: {
+        size: "$true",
+        backgroundColor: "$background",
+        alignItems: "center",
+        radiused: !0
+      }
+    },
+    size: {
+      "...size": (val, { tokens }) => ({
+        padding: tokens.space[val],
+        borderRadius: tokens.radius[val]
+      })
+    }
+  },
+  defaultVariants: {
+    unstyled: process.env.TAMAGUI_HEADLESS === "1"
+  }
+}), PopperContent = React.forwardRef(function(props, forwardedRef) {
+  const { __scopePopper, enableAnimationForPositionChange, ...rest } = props, {
+    strategy,
+    placement,
+    refs,
+    x,
+    y,
+    getFloatingProps,
+    size,
+    update,
+    floatingStyles,
+    hasFloating
+  } = usePopperContext(__scopePopper), contentRefs = (0, import_compose_refs.useComposedRefs)(refs.setFloating, forwardedRef);
+  let finalHasFloatingValue = !1;
+  if (import_constants.isAndroid) {
+    const initialRender = React.useRef(!0), finalHasFloating = React.useRef(!1);
+    hasFloating === !1 && (initialRender.current = !1), initialRender.current || (finalHasFloating.current = hasFloating), finalHasFloatingValue = finalHasFloating.current;
+  }
+  const contents = React.useMemo(() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    PopperContentFrame,
+    {
+      "data-placement": placement,
+      "data-strategy": strategy,
+      contain: "layout",
+      size,
+      ...rest
+    },
+    "popper-content-frame"
+  ), [placement, strategy, props]), [needsMeasure, setNeedsMeasure] = React.useState(!0);
+  React.useEffect(() => {
+    enableAnimationForPositionChange && (x || y) && setNeedsMeasure(!1);
+  }, [enableAnimationForPositionChange, x, y]);
+  let show = !0;
+  if (import_constants.isAndroid) {
+    const [show_, setShow] = React.useState(!1);
+    show = show_, React.useEffect(() => {
+      finalHasFloatingValue && setShow(!0);
+    }, [finalHasFloatingValue, x, y]);
+  }
+  const frameProps = {
+    ref: contentRefs,
+    x: x || 0,
+    y: y || 0,
+    top: 0,
+    left: 0,
+    position: strategy,
+    opacity: show ? 1 : 0,
+    ...enableAnimationForPositionChange && {
+      // apply animation but disable it on initial render to avoid animating from 0 to the first position
+      animation: rest.animation,
+      animateOnly: needsMeasure ? ["none"] : rest.animateOnly,
+      animatePresence: !1
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Stack, { ...getFloatingProps ? getFloatingProps(frameProps) : frameProps, children: contents });
+}), 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"
+  }
+}), 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"
+  }
+}), opposites = {
+  top: "bottom",
+  right: "left",
+  bottom: "top",
+  left: "right"
+}, PopperArrow = PopperArrowFrame.styleable(
+  function(propsIn, forwardedRef) {
+    const { __scopePopper, ...rest } = propsIn, props = (0, import_core.useProps)(rest), { offset, size: sizeProp, borderWidth = 0, ...arrowProps } = props, context = usePopperContext(__scopePopper), sizeVal = typeof sizeProp == "number" ? sizeProp : (0, import_core.getVariableValue)(
+      (0, import_get_token.getSpace)(sizeProp ?? context.size, {
+        shift: -2,
+        bounds: [2]
+      })
+    ), size = Math.max(0, +sizeVal), { placement } = context, refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef), x = context.arrowStyle?.x || 0, y = context.arrowStyle?.y || 0, primaryPlacement = placement ? placement.split("-")[0] : "top", arrowStyle = { x, y, width: size, height: size }, innerArrowStyle = {}, isVertical = primaryPlacement === "bottom" || primaryPlacement === "top";
+    if (primaryPlacement) {
+      arrowStyle[isVertical ? "width" : "height"] = size * 2;
+      const oppSide = opposites[primaryPlacement];
+      oppSide && (arrowStyle[oppSide] = -size, innerArrowStyle[oppSide] = size / 2), (oppSide === "top" || oppSide === "bottom") && (arrowStyle.left = 0), (oppSide === "left" || oppSide === "right") && (arrowStyle.top = 0), (0, import_constants.useIsomorphicLayoutEffect)(() => {
+        context.onArrowSize?.(size);
+      }, [size, context.onArrowSize]);
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperArrowOuterFrame, { ref: refs, ...arrowStyle, 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.js.map

package/dist/cjs/index.js

@@ -0,0 +1,15 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+}, __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var src_exports = {};
+module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("./Popper"), module.exports);
+//# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/popper",
-  "version": "1.116.0",
+  "version": "1.116.2",
   "sideEffects": [
     "*.css"
   ],
@@ -34,20 +34,20 @@
     }
   },
   "dependencies": {
-    "@tamagui/compose-refs": "1.116.0",
-    "@tamagui/constants": "1.116.0",
-    "@tamagui/core": "1.116.0",
-    "@tamagui/floating": "1.116.0",
-    "@tamagui/get-token": "1.116.0",
-    "@tamagui/stacks": "1.116.0",
-    "@tamagui/start-transition": "1.116.0",
-    "@tamagui/use-controllable-state": "1.116.0"
+    "@tamagui/compose-refs": "1.116.2",
+    "@tamagui/constants": "1.116.2",
+    "@tamagui/core": "1.116.2",
+    "@tamagui/floating": "1.116.2",
+    "@tamagui/get-token": "1.116.2",
+    "@tamagui/stacks": "1.116.2",
+    "@tamagui/start-transition": "1.116.2",
+    "@tamagui/use-controllable-state": "1.116.2"
   },
   "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.116.0",
+    "@tamagui/build": "1.116.2",
     "react": "^18.2.0 || ^19.0.0",
     "react-native": "0.74.1"
   },