@react-native-aria/overlays 0.3.7 → 0.3.8

package/lib/commonjs/web/overlays/src/useOverlayPosition.js

@@ -34,6 +34,8 @@ let visualViewport = typeof window !== 'undefined' && window.visualViewport;
  */
 
 function useOverlayPosition(props) {
+  var _targetRef$current, _targetRef$current2;
+
   const direction = (0, _utils.isRTL)() ? 'rtl' : undefined;
   let {
     targetRef,
@@ -57,7 +59,7 @@ function useOverlayPosition(props) {
     maxHeight: undefined,
     placement: undefined
   });
-  let deps = [shouldUpdatePosition, placement, overlayRef.current, targetRef.current, scrollRef.current, containerPadding, shouldFlip, boundaryElement, offset, crossOffset, isOpen, direction, shouldOverlapWithTrigger];
+  let deps = [shouldUpdatePosition, placement, overlayRef.current, (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.offsetLeft, (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.offsetTop, scrollRef.current, containerPadding, shouldFlip, boundaryElement, offset, crossOffset, isOpen, direction, shouldOverlapWithTrigger];
   let updatePosition = (0, _react.useCallback)(() => {
     if (shouldUpdatePosition === false || !isOpen || !overlayRef.current || !targetRef.current || !scrollRef.current || !boundaryElement) {
       return;

package/lib/commonjs/web/overlays/src/useOverlayPosition.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useOverlayPosition.ts"],"names":["visualViewport","window","useOverlayPosition","props","direction","undefined","targetRef","overlayRef","scrollRef","placement","containerPadding","shouldFlip","boundaryElement","document","body","offset","crossOffset","shouldUpdatePosition","isOpen","shouldOverlapWithTrigger","onClose","position","setPosition","arrowOffsetLeft","arrowOffsetTop","maxHeight","deps","current","updatePosition","translateRTL","overlayNode","targetNode","scrollNode","padding","useResize","isResizing","timeout","onResize","clearTimeout","setTimeout","addEventListener","removeEventListener","close","triggerRef","rendered","overlayProps","style","zIndex","arrowProps","left","top","replace"],"mappings":";;;;;;;AAaA;;AACA;;AAQA;;AACA;;AAvBA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAuDA;AACA,IAAIA,cAAc,GAAG,OAAOC,MAAP,KAAkB,WAAlB,IAAiCA,MAAM,CAACD,cAA7D;AAEA;AACA;AACA;AACA;;AACO,SAASE,kBAAT,CAA4BC,KAA5B,EAAoE;AACzE,QAAMC,SAAS,GAAG,sBAAU,KAAV,GAAkBC,SAApC;AACA,MAAI;AACFC,IAAAA,SADE;AAEFC,IAAAA,UAFE;AAGFC,IAAAA,SAAS,GAAGD,UAHV;AAIFE,IAAAA,SAAS,GAAG,QAJV;AAKFC,IAAAA,gBAAgB,GAAG,EALjB;AAMFC,IAAAA,UAAU,GAAG,IANX;AAOFC,IAAAA,eAAe,GAAG,OAAOC,QAAP,KAAoB,WAApB,GAAkCA,QAAQ,CAACC,IAA3C,GAAkD,IAPlE;AAQFC,IAAAA,MAAM,GAAG,CARP;AASFC,IAAAA,WAAW,GAAG,CATZ;AAUFC,IAAAA,oBAAoB,GAAG,IAVrB;AAWFC,IAAAA,MAAM,GAAG,IAXP;AAYFC,IAAAA,wBAAwB,GAAG,KAZzB;AAaFC,IAAAA;AAbE,MAcAjB,KAdJ;AAeA,MAAI,CAACkB,QAAD,EAAWC,WAAX,IAA0B,qBAAyB;AACrDD,IAAAA,QAAQ,EAAE,EAD2C;AAErDE,IAAAA,eAAe,EAAElB,SAFoC;AAGrDmB,IAAAA,cAAc,EAAEnB,SAHqC;AAIrDoB,IAAAA,SAAS,EAAEpB,SAJ0C;AAKrDI,IAAAA,SAAS,EAAEJ;AAL0C,GAAzB,CAA9B;AAQA,MAAIqB,IAAI,GAAG,CACTT,oBADS,EAETR,SAFS,EAGTF,UAAU,CAACoB,OAHF,EAITrB,SAAS,CAACqB,OAJD,EAKTnB,SAAS,CAACmB,OALD,EAMTjB,gBANS,EAOTC,UAPS,EAQTC,eARS,EASTG,MATS,EAUTC,WAVS,EAWTE,MAXS,EAYTd,SAZS,EAaTe,wBAbS,CAAX;AAgBA,MAAIS,cAAc,GAAG,wBAAY,MAAM;AACrC,QACEX,oBAAoB,KAAK,KAAzB,IACA,CAACC,MADD,IAEA,CAACX,UAAU,CAACoB,OAFZ,IAGA,CAACrB,SAAS,CAACqB,OAHX,IAIA,CAACnB,SAAS,CAACmB,OAJX,IAKA,CAACf,eANH,EAOE;AACA;AACD;;AAEDU,IAAAA,WAAW,CACT,0CAAkB;AAChBb,MAAAA,SAAS,EAAEoB,YAAY,CAACpB,SAAD,EAAYL,SAAZ,CADP;AAEhB0B,MAAAA,WAAW,EAAEvB,UAAU,CAACoB,OAFR;AAGhBI,MAAAA,UAAU,EAAEzB,SAAS,CAACqB,OAHN;AAIhBK,MAAAA,UAAU,EAAExB,SAAS,CAACmB,OAJN;AAKhBM,MAAAA,OAAO,EAAEvB,gBALO;AAMhBC,MAAAA,UANgB;AAOhBC,MAAAA,eAPgB;AAQhBG,MAAAA,MARgB;AAShBC,MAAAA,WATgB;AAUhBG,MAAAA;AAVgB,KAAlB,CADS,CAAX;AAcD,GA1BoB,EA0BlBO,IA1BkB,CAArB,CAzCyE,CAqEzE;;AACA,8BAAgBE,cAAhB,EAAgCF,IAAhC,EAtEyE,CAwEzE;;AACAQ,EAAAA,SAAS,CAACN,cAAD,CAAT,CAzEyE,CA2EzE;AACA;;AACA,MAAIO,UAAU,GAAG,mBAAO,KAAP,CAAjB;AACA,8BAAgB,MAAM;AACpB,QAAIC,OAAJ;;AACA,QAAIC,QAAQ,GAAG,MAAM;AACnBF,MAAAA,UAAU,CAACR,OAAX,GAAqB,IAArB;AACAW,MAAAA,YAAY,CAACF,OAAD,CAAZ;AAEAA,MAAAA,OAAO,GAAGG,UAAU,CAAC,MAAM;AACzBJ,QAAAA,UAAU,CAACR,OAAX,GAAqB,KAArB;AACD,OAFmB,EAEjB,GAFiB,CAApB;AAIAC,MAAAA,cAAc;AACf,KATD;;AAWA5B,IAAAA,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEwC,gBAAhB,CAAiC,QAAjC,EAA2CH,QAA3C;AAEA,WAAO,MAAM;AACXrC,MAAAA,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEyC,mBAAhB,CAAoC,QAApC,EAA8CJ,QAA9C;AACD,KAFD;AAGD,GAlBD,EAkBG,CAACT,cAAD,CAlBH;AAoBA,MAAIc,KAAK,GAAG,wBAAY,MAAM;AAC5B,QAAI,CAACP,UAAU,CAACR,OAAhB,EAAyB;AACvBP,MAAAA,OAAO;AACR;AACF,GAJW,EAIT,CAACA,OAAD,EAAUe,UAAV,CAJS,CAAZ,CAlGyE,CAwGzE;AACA;;AACA,0CAAiB;AACfQ,IAAAA,UAAU,EAAErC,SADG;AAEfY,IAAAA,MAFe;AAGfE,IAAAA,OAAO,EAAEA,OAAO,GAAGsB,KAAH,GAAWrC;AAHZ,GAAjB,EA1GyE,CAgHzE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;;AAEA,SAAO;AACLuC,IAAAA,QAAQ,EAAE,IADL;AAELC,IAAAA,YAAY,EAAE;AACZC,MAAAA,KAAK,EAAE;AACLzB,QAAAA,QAAQ,EAAE,UADL;AAEL0B,QAAAA,MAAM,EAAE,MAFH;AAEW;AAChB,WAAG1B,QAAQ,CAACA,QAHP;AAILI,QAAAA,SAAS,EAAEJ,QAAQ,CAACI;AAJf;AADK,KAFT;AAULhB,IAAAA,SAAS,EAAEY,QAAQ,CAACZ,SAVf;AAWLuC,IAAAA,UAAU,EAAE;AACVF,MAAAA,KAAK,EAAE;AACLG,QAAAA,IAAI,EAAE5B,QAAQ,CAACE,eADV;AAEL2B,QAAAA,GAAG,EAAE7B,QAAQ,CAACG;AAFT;AADG,KAXP;AAiBLI,IAAAA;AAjBK,GAAP;AAmBD;;AAED,SAASM,SAAT,CAAmBG,QAAnB,EAA6B;AAC3B,8BAAgB,MAAM;AACpBpC,IAAAA,MAAM,CAACuC,gBAAP,CAAwB,QAAxB,EAAkCH,QAAlC,EAA4C,KAA5C;AACA,WAAO,MAAM;AACXpC,MAAAA,MAAM,CAACwC,mBAAP,CAA2B,QAA3B,EAAqCJ,QAArC,EAA+C,KAA/C;AACD,KAFD;AAGD,GALD,EAKG,CAACA,QAAD,CALH;AAMD;;AAED,SAASR,YAAT,CAAsBR,QAAtB,EAAgCjB,SAAhC,EAA2C;AACzC,MAAIA,SAAS,KAAK,KAAlB,EAAyB;AACvB,WAAOiB,QAAQ,CAAC8B,OAAT,CAAiB,OAAjB,EAA0B,OAA1B,EAAmCA,OAAnC,CAA2C,KAA3C,EAAkD,MAAlD,CAAP;AACD;;AACD,SAAO9B,QAAQ,CAAC8B,OAAT,CAAiB,OAAjB,EAA0B,MAA1B,EAAkCA,OAAlC,CAA0C,KAA1C,EAAiD,OAAjD,CAAP;AACD","sourcesContent":["//@ts-nocheck\n/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { calculatePosition, PositionResult } from './calculatePosition';\nimport {\n  HTMLAttributes,\n  RefObject,\n  useCallback,\n  useRef,\n  useState,\n} from 'react';\nimport { Placement, PlacementAxis, PositionProps } from '@react-types/overlays';\nimport { useCloseOnScroll } from './useCloseOnScroll';\nimport { isRTL, useLayoutEffect } from '@react-native-aria/utils';\n\ninterface AriaPositionProps extends PositionProps {\n  /**\n   * Element that that serves as the positioning boundary.\n   * @default document.body\n   */\n  boundaryElement?: HTMLElement;\n  /**\n   * The ref for the element which the overlay positions itself with respect to.\n   */\n  targetRef: RefObject<HTMLElement>;\n  /**\n   * The ref for the overlay element.\n   */\n  overlayRef: RefObject<HTMLElement>;\n  /**\n   * A ref for the scrollable region within the overlay.\n   * @default overlayRef\n   */\n  scrollRef?: RefObject<HTMLElement>;\n  /**\n   * Whether the overlay should update its position automatically.\n   * @default true\n   */\n  shouldUpdatePosition?: boolean;\n  /** Handler that is called when the overlay should close. */\n  onClose?: () => void;\n  /** Determines whether the overlay should overlap with the trigger */\n  shouldOverlapWithTrigger?: boolean;\n}\n\ninterface PositionAria {\n  /** Props for the overlay container element. */\n  overlayProps: HTMLAttributes<Element>;\n  /** Props for the overlay tip arrow if any. */\n  arrowProps: HTMLAttributes<Element>;\n  /** Placement of the overlay with respect to the overlay trigger. */\n  placement: PlacementAxis;\n  /** Updates the position of the overlay. */\n  updatePosition(): void;\n}\n\n// @ts-ignore\nlet visualViewport = typeof window !== 'undefined' && window.visualViewport;\n\n/**\n * Handles positioning overlays like popovers and menus relative to a trigger\n * element, and updating the position when the window resizes.\n */\nexport function useOverlayPosition(props: AriaPositionProps): PositionAria {\n  const direction = isRTL() ? 'rtl' : undefined;\n  let {\n    targetRef,\n    overlayRef,\n    scrollRef = overlayRef,\n    placement = 'bottom' as Placement,\n    containerPadding = 12,\n    shouldFlip = true,\n    boundaryElement = typeof document !== 'undefined' ? document.body : null,\n    offset = 0,\n    crossOffset = 0,\n    shouldUpdatePosition = true,\n    isOpen = true,\n    shouldOverlapWithTrigger = false,\n    onClose,\n  } = props;\n  let [position, setPosition] = useState<PositionResult>({\n    position: {},\n    arrowOffsetLeft: undefined,\n    arrowOffsetTop: undefined,\n    maxHeight: undefined,\n    placement: undefined,\n  });\n\n  let deps = [\n    shouldUpdatePosition,\n    placement,\n    overlayRef.current,\n    targetRef.current,\n    scrollRef.current,\n    containerPadding,\n    shouldFlip,\n    boundaryElement,\n    offset,\n    crossOffset,\n    isOpen,\n    direction,\n    shouldOverlapWithTrigger,\n  ];\n\n  let updatePosition = useCallback(() => {\n    if (\n      shouldUpdatePosition === false ||\n      !isOpen ||\n      !overlayRef.current ||\n      !targetRef.current ||\n      !scrollRef.current ||\n      !boundaryElement\n    ) {\n      return;\n    }\n\n    setPosition(\n      calculatePosition({\n        placement: translateRTL(placement, direction),\n        overlayNode: overlayRef.current,\n        targetNode: targetRef.current,\n        scrollNode: scrollRef.current,\n        padding: containerPadding,\n        shouldFlip,\n        boundaryElement,\n        offset,\n        crossOffset,\n        shouldOverlapWithTrigger,\n      })\n    );\n  }, deps);\n\n  // Update position when anything changes\n  useLayoutEffect(updatePosition, deps);\n\n  // Update position on window resize\n  useResize(updatePosition);\n\n  // Reposition the overlay and do not close on scroll while the visual viewport is resizing.\n  // This will ensure that overlays adjust their positioning when the iOS virtual keyboard appears.\n  let isResizing = useRef(false);\n  useLayoutEffect(() => {\n    let timeout: NodeJS.Timeout;\n    let onResize = () => {\n      isResizing.current = true;\n      clearTimeout(timeout);\n\n      timeout = setTimeout(() => {\n        isResizing.current = false;\n      }, 500);\n\n      updatePosition();\n    };\n\n    visualViewport?.addEventListener('resize', onResize);\n\n    return () => {\n      visualViewport?.removeEventListener('resize', onResize);\n    };\n  }, [updatePosition]);\n\n  let close = useCallback(() => {\n    if (!isResizing.current) {\n      onClose();\n    }\n  }, [onClose, isResizing]);\n\n  // When scrolling a parent scrollable region of the trigger (other than the body),\n  // we hide the popover. Otherwise, its position would be incorrect.\n  useCloseOnScroll({\n    triggerRef: targetRef,\n    isOpen,\n    onClose: onClose ? close : undefined,\n  });\n\n  // useLayoutEffect(() => {\n  //   const mutationObserver = new MutationObserver((mutations) => {\n  //     updatePosition();\n  //     mutations.forEach((mutation) => {\n  //       // if (mutation.attributeName === 'style') {\n  //       //   const transform = mutation.target.style.transform;\n  //       //   if (transform) {\n  //       //     const match = transform.match(/scale\\((.+)\\)/);\n  //       //     if (match) {\n  //       //       const scale = parseFloat(match[1]);\n  //       //       console.log(`Scale: ${scale}`);\n  //       //       // updatePosition();\n  //       //     }\n  //       //   }\n  //       // }\n  //     });\n  //   });\n\n  //   mutationObserver.observe(overlayRef?.current, { attributes: true });\n\n  //   return () => mutationObserver.disconnect();\n  // }, [overlayRef, updatePosition]);\n\n  return {\n    rendered: true,\n    overlayProps: {\n      style: {\n        position: 'absolute',\n        zIndex: 100000, // should match the z-index in ModalTrigger\n        ...position.position,\n        maxHeight: position.maxHeight,\n      },\n    },\n    placement: position.placement,\n    arrowProps: {\n      style: {\n        left: position.arrowOffsetLeft,\n        top: position.arrowOffsetTop,\n      },\n    },\n    updatePosition,\n  };\n}\n\nfunction useResize(onResize) {\n  useLayoutEffect(() => {\n    window.addEventListener('resize', onResize, false);\n    return () => {\n      window.removeEventListener('resize', onResize, false);\n    };\n  }, [onResize]);\n}\n\nfunction translateRTL(position, direction) {\n  if (direction === 'rtl') {\n    return position.replace('start', 'right').replace('end', 'left');\n  }\n  return position.replace('start', 'left').replace('end', 'right');\n}\n"]}
+{"version":3,"sources":["useOverlayPosition.ts"],"names":["visualViewport","window","useOverlayPosition","props","direction","undefined","targetRef","overlayRef","scrollRef","placement","containerPadding","shouldFlip","boundaryElement","document","body","offset","crossOffset","shouldUpdatePosition","isOpen","shouldOverlapWithTrigger","onClose","position","setPosition","arrowOffsetLeft","arrowOffsetTop","maxHeight","deps","current","offsetLeft","offsetTop","updatePosition","translateRTL","overlayNode","targetNode","scrollNode","padding","useResize","isResizing","timeout","onResize","clearTimeout","setTimeout","addEventListener","removeEventListener","close","triggerRef","rendered","overlayProps","style","zIndex","arrowProps","left","top","replace"],"mappings":"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","sourcesContent":["//@ts-nocheck\n/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { calculatePosition, PositionResult } from './calculatePosition';\nimport {\n  HTMLAttributes,\n  RefObject,\n  useCallback,\n  useRef,\n  useState,\n} from 'react';\nimport { Placement, PlacementAxis, PositionProps } from '@react-types/overlays';\nimport { useCloseOnScroll } from './useCloseOnScroll';\nimport { isRTL, useLayoutEffect } from '@react-native-aria/utils';\n\ninterface AriaPositionProps extends PositionProps {\n  /**\n   * Element that that serves as the positioning boundary.\n   * @default document.body\n   */\n  boundaryElement?: HTMLElement;\n  /**\n   * The ref for the element which the overlay positions itself with respect to.\n   */\n  targetRef: RefObject<HTMLElement>;\n  /**\n   * The ref for the overlay element.\n   */\n  overlayRef: RefObject<HTMLElement>;\n  /**\n   * A ref for the scrollable region within the overlay.\n   * @default overlayRef\n   */\n  scrollRef?: RefObject<HTMLElement>;\n  /**\n   * Whether the overlay should update its position automatically.\n   * @default true\n   */\n  shouldUpdatePosition?: boolean;\n  /** Handler that is called when the overlay should close. */\n  onClose?: () => void;\n  /** Determines whether the overlay should overlap with the trigger */\n  shouldOverlapWithTrigger?: boolean;\n}\n\ninterface PositionAria {\n  /** Props for the overlay container element. */\n  overlayProps: HTMLAttributes<Element>;\n  /** Props for the overlay tip arrow if any. */\n  arrowProps: HTMLAttributes<Element>;\n  /** Placement of the overlay with respect to the overlay trigger. */\n  placement: PlacementAxis;\n  /** Updates the position of the overlay. */\n  updatePosition(): void;\n}\n\n// @ts-ignore\nlet visualViewport = typeof window !== 'undefined' && window.visualViewport;\n\n/**\n * Handles positioning overlays like popovers and menus relative to a trigger\n * element, and updating the position when the window resizes.\n */\nexport function useOverlayPosition(props: AriaPositionProps): PositionAria {\n  const direction = isRTL() ? 'rtl' : undefined;\n  let {\n    targetRef,\n    overlayRef,\n    scrollRef = overlayRef,\n    placement = 'bottom' as Placement,\n    containerPadding = 12,\n    shouldFlip = true,\n    boundaryElement = typeof document !== 'undefined' ? document.body : null,\n    offset = 0,\n    crossOffset = 0,\n    shouldUpdatePosition = true,\n    isOpen = true,\n    shouldOverlapWithTrigger = false,\n    onClose,\n  } = props;\n  let [position, setPosition] = useState<PositionResult>({\n    position: {},\n    arrowOffsetLeft: undefined,\n    arrowOffsetTop: undefined,\n    maxHeight: undefined,\n    placement: undefined,\n  });\n\n  let deps = [\n    shouldUpdatePosition,\n    placement,\n    overlayRef.current,\n    targetRef.current?.offsetLeft,\n    targetRef.current?.offsetTop,\n    scrollRef.current,\n    containerPadding,\n    shouldFlip,\n    boundaryElement,\n    offset,\n    crossOffset,\n    isOpen,\n    direction,\n    shouldOverlapWithTrigger,\n  ];\n\n  let updatePosition = useCallback(() => {\n    if (\n      shouldUpdatePosition === false ||\n      !isOpen ||\n      !overlayRef.current ||\n      !targetRef.current ||\n      !scrollRef.current ||\n      !boundaryElement\n    ) {\n      return;\n    }\n\n    setPosition(\n      calculatePosition({\n        placement: translateRTL(placement, direction),\n        overlayNode: overlayRef.current,\n        targetNode: targetRef.current,\n        scrollNode: scrollRef.current,\n        padding: containerPadding,\n        shouldFlip,\n        boundaryElement,\n        offset,\n        crossOffset,\n        shouldOverlapWithTrigger,\n      })\n    );\n  }, deps);\n\n  // Update position when anything changes\n  useLayoutEffect(updatePosition, deps);\n\n  // Update position on window resize\n  useResize(updatePosition);\n\n  // Reposition the overlay and do not close on scroll while the visual viewport is resizing.\n  // This will ensure that overlays adjust their positioning when the iOS virtual keyboard appears.\n  let isResizing = useRef(false);\n  useLayoutEffect(() => {\n    let timeout: NodeJS.Timeout;\n    let onResize = () => {\n      isResizing.current = true;\n      clearTimeout(timeout);\n\n      timeout = setTimeout(() => {\n        isResizing.current = false;\n      }, 500);\n\n      updatePosition();\n    };\n\n    visualViewport?.addEventListener('resize', onResize);\n\n    return () => {\n      visualViewport?.removeEventListener('resize', onResize);\n    };\n  }, [updatePosition]);\n\n  let close = useCallback(() => {\n    if (!isResizing.current) {\n      onClose();\n    }\n  }, [onClose, isResizing]);\n\n  // When scrolling a parent scrollable region of the trigger (other than the body),\n  // we hide the popover. Otherwise, its position would be incorrect.\n  useCloseOnScroll({\n    triggerRef: targetRef,\n    isOpen,\n    onClose: onClose ? close : undefined,\n  });\n\n  // useLayoutEffect(() => {\n  //   const mutationObserver = new MutationObserver((mutations) => {\n  //     updatePosition();\n  //     mutations.forEach((mutation) => {\n  //       // if (mutation.attributeName === 'style') {\n  //       //   const transform = mutation.target.style.transform;\n  //       //   if (transform) {\n  //       //     const match = transform.match(/scale\\((.+)\\)/);\n  //       //     if (match) {\n  //       //       const scale = parseFloat(match[1]);\n  //       //       console.log(`Scale: ${scale}`);\n  //       //       // updatePosition();\n  //       //     }\n  //       //   }\n  //       // }\n  //     });\n  //   });\n\n  //   mutationObserver.observe(overlayRef?.current, { attributes: true });\n\n  //   return () => mutationObserver.disconnect();\n  // }, [overlayRef, updatePosition]);\n\n  return {\n    rendered: true,\n    overlayProps: {\n      style: {\n        position: 'absolute',\n        zIndex: 100000, // should match the z-index in ModalTrigger\n        ...position.position,\n        maxHeight: position.maxHeight,\n      },\n    },\n    placement: position.placement,\n    arrowProps: {\n      style: {\n        left: position.arrowOffsetLeft,\n        top: position.arrowOffsetTop,\n      },\n    },\n    updatePosition,\n  };\n}\n\nfunction useResize(onResize) {\n  useLayoutEffect(() => {\n    window.addEventListener('resize', onResize, false);\n    return () => {\n      window.removeEventListener('resize', onResize, false);\n    };\n  }, [onResize]);\n}\n\nfunction translateRTL(position, direction) {\n  if (direction === 'rtl') {\n    return position.replace('start', 'right').replace('end', 'left');\n  }\n  return position.replace('start', 'left').replace('end', 'right');\n}\n"]}

package/lib/module/web/overlays/src/useOverlayPosition.js

@@ -23,6 +23,8 @@ let visualViewport = typeof window !== 'undefined' && window.visualViewport;
  */
 
 export function useOverlayPosition(props) {
+  var _targetRef$current, _targetRef$current2;
+
   const direction = isRTL() ? 'rtl' : undefined;
   let {
     targetRef,
@@ -46,7 +48,7 @@ export function useOverlayPosition(props) {
     maxHeight: undefined,
     placement: undefined
   });
-  let deps = [shouldUpdatePosition, placement, overlayRef.current, targetRef.current, scrollRef.current, containerPadding, shouldFlip, boundaryElement, offset, crossOffset, isOpen, direction, shouldOverlapWithTrigger];
+  let deps = [shouldUpdatePosition, placement, overlayRef.current, (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.offsetLeft, (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.offsetTop, scrollRef.current, containerPadding, shouldFlip, boundaryElement, offset, crossOffset, isOpen, direction, shouldOverlapWithTrigger];
   let updatePosition = useCallback(() => {
     if (shouldUpdatePosition === false || !isOpen || !overlayRef.current || !targetRef.current || !scrollRef.current || !boundaryElement) {
       return;

package/lib/module/web/overlays/src/useOverlayPosition.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useOverlayPosition.ts"],"names":["calculatePosition","useCallback","useRef","useState","useCloseOnScroll","isRTL","useLayoutEffect","visualViewport","window","useOverlayPosition","props","direction","undefined","targetRef","overlayRef","scrollRef","placement","containerPadding","shouldFlip","boundaryElement","document","body","offset","crossOffset","shouldUpdatePosition","isOpen","shouldOverlapWithTrigger","onClose","position","setPosition","arrowOffsetLeft","arrowOffsetTop","maxHeight","deps","current","updatePosition","translateRTL","overlayNode","targetNode","scrollNode","padding","useResize","isResizing","timeout","onResize","clearTimeout","setTimeout","addEventListener","removeEventListener","close","triggerRef","rendered","overlayProps","style","zIndex","arrowProps","left","top","replace"],"mappings":"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","sourcesContent":["//@ts-nocheck\n/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { calculatePosition, PositionResult } from './calculatePosition';\nimport {\n  HTMLAttributes,\n  RefObject,\n  useCallback,\n  useRef,\n  useState,\n} from 'react';\nimport { Placement, PlacementAxis, PositionProps } from '@react-types/overlays';\nimport { useCloseOnScroll } from './useCloseOnScroll';\nimport { isRTL, useLayoutEffect } from '@react-native-aria/utils';\n\ninterface AriaPositionProps extends PositionProps {\n  /**\n   * Element that that serves as the positioning boundary.\n   * @default document.body\n   */\n  boundaryElement?: HTMLElement;\n  /**\n   * The ref for the element which the overlay positions itself with respect to.\n   */\n  targetRef: RefObject<HTMLElement>;\n  /**\n   * The ref for the overlay element.\n   */\n  overlayRef: RefObject<HTMLElement>;\n  /**\n   * A ref for the scrollable region within the overlay.\n   * @default overlayRef\n   */\n  scrollRef?: RefObject<HTMLElement>;\n  /**\n   * Whether the overlay should update its position automatically.\n   * @default true\n   */\n  shouldUpdatePosition?: boolean;\n  /** Handler that is called when the overlay should close. */\n  onClose?: () => void;\n  /** Determines whether the overlay should overlap with the trigger */\n  shouldOverlapWithTrigger?: boolean;\n}\n\ninterface PositionAria {\n  /** Props for the overlay container element. */\n  overlayProps: HTMLAttributes<Element>;\n  /** Props for the overlay tip arrow if any. */\n  arrowProps: HTMLAttributes<Element>;\n  /** Placement of the overlay with respect to the overlay trigger. */\n  placement: PlacementAxis;\n  /** Updates the position of the overlay. */\n  updatePosition(): void;\n}\n\n// @ts-ignore\nlet visualViewport = typeof window !== 'undefined' && window.visualViewport;\n\n/**\n * Handles positioning overlays like popovers and menus relative to a trigger\n * element, and updating the position when the window resizes.\n */\nexport function useOverlayPosition(props: AriaPositionProps): PositionAria {\n  const direction = isRTL() ? 'rtl' : undefined;\n  let {\n    targetRef,\n    overlayRef,\n    scrollRef = overlayRef,\n    placement = 'bottom' as Placement,\n    containerPadding = 12,\n    shouldFlip = true,\n    boundaryElement = typeof document !== 'undefined' ? document.body : null,\n    offset = 0,\n    crossOffset = 0,\n    shouldUpdatePosition = true,\n    isOpen = true,\n    shouldOverlapWithTrigger = false,\n    onClose,\n  } = props;\n  let [position, setPosition] = useState<PositionResult>({\n    position: {},\n    arrowOffsetLeft: undefined,\n    arrowOffsetTop: undefined,\n    maxHeight: undefined,\n    placement: undefined,\n  });\n\n  let deps = [\n    shouldUpdatePosition,\n    placement,\n    overlayRef.current,\n    targetRef.current,\n    scrollRef.current,\n    containerPadding,\n    shouldFlip,\n    boundaryElement,\n    offset,\n    crossOffset,\n    isOpen,\n    direction,\n    shouldOverlapWithTrigger,\n  ];\n\n  let updatePosition = useCallback(() => {\n    if (\n      shouldUpdatePosition === false ||\n      !isOpen ||\n      !overlayRef.current ||\n      !targetRef.current ||\n      !scrollRef.current ||\n      !boundaryElement\n    ) {\n      return;\n    }\n\n    setPosition(\n      calculatePosition({\n        placement: translateRTL(placement, direction),\n        overlayNode: overlayRef.current,\n        targetNode: targetRef.current,\n        scrollNode: scrollRef.current,\n        padding: containerPadding,\n        shouldFlip,\n        boundaryElement,\n        offset,\n        crossOffset,\n        shouldOverlapWithTrigger,\n      })\n    );\n  }, deps);\n\n  // Update position when anything changes\n  useLayoutEffect(updatePosition, deps);\n\n  // Update position on window resize\n  useResize(updatePosition);\n\n  // Reposition the overlay and do not close on scroll while the visual viewport is resizing.\n  // This will ensure that overlays adjust their positioning when the iOS virtual keyboard appears.\n  let isResizing = useRef(false);\n  useLayoutEffect(() => {\n    let timeout: NodeJS.Timeout;\n    let onResize = () => {\n      isResizing.current = true;\n      clearTimeout(timeout);\n\n      timeout = setTimeout(() => {\n        isResizing.current = false;\n      }, 500);\n\n      updatePosition();\n    };\n\n    visualViewport?.addEventListener('resize', onResize);\n\n    return () => {\n      visualViewport?.removeEventListener('resize', onResize);\n    };\n  }, [updatePosition]);\n\n  let close = useCallback(() => {\n    if (!isResizing.current) {\n      onClose();\n    }\n  }, [onClose, isResizing]);\n\n  // When scrolling a parent scrollable region of the trigger (other than the body),\n  // we hide the popover. Otherwise, its position would be incorrect.\n  useCloseOnScroll({\n    triggerRef: targetRef,\n    isOpen,\n    onClose: onClose ? close : undefined,\n  });\n\n  // useLayoutEffect(() => {\n  //   const mutationObserver = new MutationObserver((mutations) => {\n  //     updatePosition();\n  //     mutations.forEach((mutation) => {\n  //       // if (mutation.attributeName === 'style') {\n  //       //   const transform = mutation.target.style.transform;\n  //       //   if (transform) {\n  //       //     const match = transform.match(/scale\\((.+)\\)/);\n  //       //     if (match) {\n  //       //       const scale = parseFloat(match[1]);\n  //       //       console.log(`Scale: ${scale}`);\n  //       //       // updatePosition();\n  //       //     }\n  //       //   }\n  //       // }\n  //     });\n  //   });\n\n  //   mutationObserver.observe(overlayRef?.current, { attributes: true });\n\n  //   return () => mutationObserver.disconnect();\n  // }, [overlayRef, updatePosition]);\n\n  return {\n    rendered: true,\n    overlayProps: {\n      style: {\n        position: 'absolute',\n        zIndex: 100000, // should match the z-index in ModalTrigger\n        ...position.position,\n        maxHeight: position.maxHeight,\n      },\n    },\n    placement: position.placement,\n    arrowProps: {\n      style: {\n        left: position.arrowOffsetLeft,\n        top: position.arrowOffsetTop,\n      },\n    },\n    updatePosition,\n  };\n}\n\nfunction useResize(onResize) {\n  useLayoutEffect(() => {\n    window.addEventListener('resize', onResize, false);\n    return () => {\n      window.removeEventListener('resize', onResize, false);\n    };\n  }, [onResize]);\n}\n\nfunction translateRTL(position, direction) {\n  if (direction === 'rtl') {\n    return position.replace('start', 'right').replace('end', 'left');\n  }\n  return position.replace('start', 'left').replace('end', 'right');\n}\n"]}
+{"version":3,"sources":["useOverlayPosition.ts"],"names":["calculatePosition","useCallback","useRef","useState","useCloseOnScroll","isRTL","useLayoutEffect","visualViewport","window","useOverlayPosition","props","direction","undefined","targetRef","overlayRef","scrollRef","placement","containerPadding","shouldFlip","boundaryElement","document","body","offset","crossOffset","shouldUpdatePosition","isOpen","shouldOverlapWithTrigger","onClose","position","setPosition","arrowOffsetLeft","arrowOffsetTop","maxHeight","deps","current","offsetLeft","offsetTop","updatePosition","translateRTL","overlayNode","targetNode","scrollNode","padding","useResize","isResizing","timeout","onResize","clearTimeout","setTimeout","addEventListener","removeEventListener","close","triggerRef","rendered","overlayProps","style","zIndex","arrowProps","left","top","replace"],"mappings":"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","sourcesContent":["//@ts-nocheck\n/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { calculatePosition, PositionResult } from './calculatePosition';\nimport {\n  HTMLAttributes,\n  RefObject,\n  useCallback,\n  useRef,\n  useState,\n} from 'react';\nimport { Placement, PlacementAxis, PositionProps } from '@react-types/overlays';\nimport { useCloseOnScroll } from './useCloseOnScroll';\nimport { isRTL, useLayoutEffect } from '@react-native-aria/utils';\n\ninterface AriaPositionProps extends PositionProps {\n  /**\n   * Element that that serves as the positioning boundary.\n   * @default document.body\n   */\n  boundaryElement?: HTMLElement;\n  /**\n   * The ref for the element which the overlay positions itself with respect to.\n   */\n  targetRef: RefObject<HTMLElement>;\n  /**\n   * The ref for the overlay element.\n   */\n  overlayRef: RefObject<HTMLElement>;\n  /**\n   * A ref for the scrollable region within the overlay.\n   * @default overlayRef\n   */\n  scrollRef?: RefObject<HTMLElement>;\n  /**\n   * Whether the overlay should update its position automatically.\n   * @default true\n   */\n  shouldUpdatePosition?: boolean;\n  /** Handler that is called when the overlay should close. */\n  onClose?: () => void;\n  /** Determines whether the overlay should overlap with the trigger */\n  shouldOverlapWithTrigger?: boolean;\n}\n\ninterface PositionAria {\n  /** Props for the overlay container element. */\n  overlayProps: HTMLAttributes<Element>;\n  /** Props for the overlay tip arrow if any. */\n  arrowProps: HTMLAttributes<Element>;\n  /** Placement of the overlay with respect to the overlay trigger. */\n  placement: PlacementAxis;\n  /** Updates the position of the overlay. */\n  updatePosition(): void;\n}\n\n// @ts-ignore\nlet visualViewport = typeof window !== 'undefined' && window.visualViewport;\n\n/**\n * Handles positioning overlays like popovers and menus relative to a trigger\n * element, and updating the position when the window resizes.\n */\nexport function useOverlayPosition(props: AriaPositionProps): PositionAria {\n  const direction = isRTL() ? 'rtl' : undefined;\n  let {\n    targetRef,\n    overlayRef,\n    scrollRef = overlayRef,\n    placement = 'bottom' as Placement,\n    containerPadding = 12,\n    shouldFlip = true,\n    boundaryElement = typeof document !== 'undefined' ? document.body : null,\n    offset = 0,\n    crossOffset = 0,\n    shouldUpdatePosition = true,\n    isOpen = true,\n    shouldOverlapWithTrigger = false,\n    onClose,\n  } = props;\n  let [position, setPosition] = useState<PositionResult>({\n    position: {},\n    arrowOffsetLeft: undefined,\n    arrowOffsetTop: undefined,\n    maxHeight: undefined,\n    placement: undefined,\n  });\n\n  let deps = [\n    shouldUpdatePosition,\n    placement,\n    overlayRef.current,\n    targetRef.current?.offsetLeft,\n    targetRef.current?.offsetTop,\n    scrollRef.current,\n    containerPadding,\n    shouldFlip,\n    boundaryElement,\n    offset,\n    crossOffset,\n    isOpen,\n    direction,\n    shouldOverlapWithTrigger,\n  ];\n\n  let updatePosition = useCallback(() => {\n    if (\n      shouldUpdatePosition === false ||\n      !isOpen ||\n      !overlayRef.current ||\n      !targetRef.current ||\n      !scrollRef.current ||\n      !boundaryElement\n    ) {\n      return;\n    }\n\n    setPosition(\n      calculatePosition({\n        placement: translateRTL(placement, direction),\n        overlayNode: overlayRef.current,\n        targetNode: targetRef.current,\n        scrollNode: scrollRef.current,\n        padding: containerPadding,\n        shouldFlip,\n        boundaryElement,\n        offset,\n        crossOffset,\n        shouldOverlapWithTrigger,\n      })\n    );\n  }, deps);\n\n  // Update position when anything changes\n  useLayoutEffect(updatePosition, deps);\n\n  // Update position on window resize\n  useResize(updatePosition);\n\n  // Reposition the overlay and do not close on scroll while the visual viewport is resizing.\n  // This will ensure that overlays adjust their positioning when the iOS virtual keyboard appears.\n  let isResizing = useRef(false);\n  useLayoutEffect(() => {\n    let timeout: NodeJS.Timeout;\n    let onResize = () => {\n      isResizing.current = true;\n      clearTimeout(timeout);\n\n      timeout = setTimeout(() => {\n        isResizing.current = false;\n      }, 500);\n\n      updatePosition();\n    };\n\n    visualViewport?.addEventListener('resize', onResize);\n\n    return () => {\n      visualViewport?.removeEventListener('resize', onResize);\n    };\n  }, [updatePosition]);\n\n  let close = useCallback(() => {\n    if (!isResizing.current) {\n      onClose();\n    }\n  }, [onClose, isResizing]);\n\n  // When scrolling a parent scrollable region of the trigger (other than the body),\n  // we hide the popover. Otherwise, its position would be incorrect.\n  useCloseOnScroll({\n    triggerRef: targetRef,\n    isOpen,\n    onClose: onClose ? close : undefined,\n  });\n\n  // useLayoutEffect(() => {\n  //   const mutationObserver = new MutationObserver((mutations) => {\n  //     updatePosition();\n  //     mutations.forEach((mutation) => {\n  //       // if (mutation.attributeName === 'style') {\n  //       //   const transform = mutation.target.style.transform;\n  //       //   if (transform) {\n  //       //     const match = transform.match(/scale\\((.+)\\)/);\n  //       //     if (match) {\n  //       //       const scale = parseFloat(match[1]);\n  //       //       console.log(`Scale: ${scale}`);\n  //       //       // updatePosition();\n  //       //     }\n  //       //   }\n  //       // }\n  //     });\n  //   });\n\n  //   mutationObserver.observe(overlayRef?.current, { attributes: true });\n\n  //   return () => mutationObserver.disconnect();\n  // }, [overlayRef, updatePosition]);\n\n  return {\n    rendered: true,\n    overlayProps: {\n      style: {\n        position: 'absolute',\n        zIndex: 100000, // should match the z-index in ModalTrigger\n        ...position.position,\n        maxHeight: position.maxHeight,\n      },\n    },\n    placement: position.placement,\n    arrowProps: {\n      style: {\n        left: position.arrowOffsetLeft,\n        top: position.arrowOffsetTop,\n      },\n    },\n    updatePosition,\n  };\n}\n\nfunction useResize(onResize) {\n  useLayoutEffect(() => {\n    window.addEventListener('resize', onResize, false);\n    return () => {\n      window.removeEventListener('resize', onResize, false);\n    };\n  }, [onResize]);\n}\n\nfunction translateRTL(position, direction) {\n  if (direction === 'rtl') {\n    return position.replace('start', 'right').replace('end', 'left');\n  }\n  return position.replace('start', 'left').replace('end', 'right');\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-aria/overlays",
-  "version": "0.3.7",
+  "version": "0.3.8",
   "description": "Overlay utilities. Part of react-native-aria",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/src/web/overlays/src/useOverlayPosition.ts

@@ -100,7 +100,8 @@ export function useOverlayPosition(props: AriaPositionProps): PositionAria {
     shouldUpdatePosition,
     placement,
     overlayRef.current,
-    targetRef.current,
+    targetRef.current?.offsetLeft,
+    targetRef.current?.offsetTop,
     scrollRef.current,
     containerPadding,
     shouldFlip,