@codecademy/gamut 72.2.2-alpha.ca06a3.0 → 72.2.2-alpha.d894be.0

package/dist/Pagination/utils.js

@@ -1,7 +1,9 @@
+import { timingValues } from '@codecademy/gamut-styles';
 import { AnimatePresence, motion } from 'framer-motion';
 import { useEffect, useRef } from 'react';
 import * as React from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";
+const FADE_DURATION_SECONDS = timingValues.base / 1000;
 export const shouldPagesChange = ({
   chapterSize,
   currentPage,
@@ -49,7 +51,7 @@ export const wrapWithSlideAnimation = WrappedComponent => {
         exit: "hidden",
         initial: props.buttonDirection === 'forward' && isFirstRender.current ? 'shown' : 'hidden',
         transition: {
-          duration: 0.3
+          duration: FADE_DURATION_SECONDS
         },
         variants: slideAnimationVariants,
         children: /*#__PURE__*/_jsx(WrappedComponent, {
@@ -69,6 +71,16 @@ const fadeAnimationVariants = {
     cursor: 'default'
   }
 };
+const fadeTransition = {
+  duration: FADE_DURATION_SECONDS,
+  ease: 'easeOut',
+  transitionStart: {
+    visibility: 'visible'
+  },
+  transitionEnd: {
+    visibility: 'hidden'
+  }
+};
 export const createAnimatedFadeButton = WrappedComponent => {
   const AnimatedButton = motion.create(WrappedComponent);
   return props => /*#__PURE__*/_jsx(AnimatedButton, {
@@ -76,16 +88,7 @@ export const createAnimatedFadeButton = WrappedComponent => {
     "aria-label": props.showButton === 'hidden' ? undefined : props['aria-label'],
     disabled: props.showButton === 'hidden',
     initial: false,
-    transition: {
-      transitionStart: {
-        visibility: 'visible'
-      },
-      duration: 0.3,
-      ease: [0.04, 0.62, 0.23, 0.98],
-      transitionEnd: {
-        visibility: 'hidden'
-      }
-    },
+    transition: fadeTransition,
     variants: fadeAnimationVariants,
     ...props
   });

package/dist/PatternBackdrop/PatternBackdrop.d.ts

@@ -6,11 +6,11 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    p?: import("@codecademy/variance/dist/types/config").Scale<{
+    p?: import("@codecademy/variance").Scale<{
         readonly property: "padding";
         readonly scale: "spacing";
     }>;
-    height?: import("@codecademy/variance/dist/types/config").Scale<{
+    height?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "height";
             readonly logical: "blockSize";
@@ -18,7 +18,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly transform: (value: string | number) => string | 0;
     }>;
-    width?: import("@codecademy/variance/dist/types/config").Scale<{
+    width?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "width";
             readonly logical: "inlineSize";
@@ -26,43 +26,43 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly transform: (value: string | number) => string | 0;
     }>;
-    alignSelf?: import("@codecademy/variance/dist/types/config").Scale<{
+    alignSelf?: import("@codecademy/variance").Scale<{
         readonly property: "alignSelf";
     }>;
-    containerType?: import("@codecademy/variance/dist/types/config").Scale<{
+    containerType?: import("@codecademy/variance").Scale<{
         readonly property: "containerType";
     }>;
-    direction?: import("@codecademy/variance/dist/types/config").Scale<{
+    direction?: import("@codecademy/variance").Scale<{
         readonly property: "direction";
     }>;
-    display?: import("@codecademy/variance/dist/types/config").Scale<{
+    display?: import("@codecademy/variance").Scale<{
         readonly property: "display";
     }>;
-    flexBasis?: import("@codecademy/variance/dist/types/config").Scale<{
+    flexBasis?: import("@codecademy/variance").Scale<{
         readonly property: "flexBasis";
     }>;
-    flexGrow?: import("@codecademy/variance/dist/types/config").Scale<{
+    flexGrow?: import("@codecademy/variance").Scale<{
         readonly property: "flexGrow";
     }>;
-    flexShrink?: import("@codecademy/variance/dist/types/config").Scale<{
+    flexShrink?: import("@codecademy/variance").Scale<{
         readonly property: "flexShrink";
     }>;
-    gridColumnEnd?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridColumnEnd?: import("@codecademy/variance").Scale<{
         readonly property: "gridColumnEnd";
     }>;
-    gridColumnStart?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridColumnStart?: import("@codecademy/variance").Scale<{
         readonly property: "gridColumnStart";
     }>;
-    gridRowEnd?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridRowEnd?: import("@codecademy/variance").Scale<{
         readonly property: "gridRowEnd";
     }>;
-    gridRowStart?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridRowStart?: import("@codecademy/variance").Scale<{
         readonly property: "gridRowStart";
     }>;
-    justifySelf?: import("@codecademy/variance/dist/types/config").Scale<{
+    justifySelf?: import("@codecademy/variance").Scale<{
         readonly property: "justifySelf";
     }>;
-    maxHeight?: import("@codecademy/variance/dist/types/config").Scale<{
+    maxHeight?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "maxHeight";
             readonly logical: "maxBlockSize";
@@ -70,7 +70,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly transform: (value: string | number) => string | 0;
     }>;
-    maxWidth?: import("@codecademy/variance/dist/types/config").Scale<{
+    maxWidth?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "maxWidth";
             readonly logical: "maxInlineSize";
@@ -78,7 +78,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly transform: (value: string | number) => string | 0;
     }>;
-    minHeight?: import("@codecademy/variance/dist/types/config").Scale<{
+    minHeight?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "minHeight";
             readonly logical: "minBlockSize";
@@ -86,7 +86,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly transform: (value: string | number) => string | 0;
     }>;
-    minWidth?: import("@codecademy/variance/dist/types/config").Scale<{
+    minWidth?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "minWidth";
             readonly logical: "minInlineSize";
@@ -94,39 +94,39 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly transform: (value: string | number) => string | 0;
     }>;
-    order?: import("@codecademy/variance/dist/types/config").Scale<{
+    order?: import("@codecademy/variance").Scale<{
         readonly property: "order";
     }>;
-    overflowX?: import("@codecademy/variance/dist/types/config").Scale<{
+    overflowX?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "overflowX";
             readonly logical: "overflowInline";
         };
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    overflowY?: import("@codecademy/variance/dist/types/config").Scale<{
+    overflowY?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "overflowY";
             readonly logical: "overflowBlock";
         };
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    verticalAlign?: import("@codecademy/variance/dist/types/config").Scale<{
+    verticalAlign?: import("@codecademy/variance").Scale<{
         readonly property: "verticalAlign";
     }>;
-    gridArea?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridArea?: import("@codecademy/variance").Scale<{
         readonly property: "gridArea";
     }>;
-    gridColumn?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridColumn?: import("@codecademy/variance").Scale<{
         readonly property: "gridColumn";
     }>;
-    gridRow?: import("@codecademy/variance/dist/types/config").Scale<{
+    gridRow?: import("@codecademy/variance").Scale<{
         readonly property: "gridRow";
     }>;
-    overflow?: import("@codecademy/variance/dist/types/config").Scale<{
+    overflow?: import("@codecademy/variance").Scale<{
         readonly property: "overflow";
     }>;
-    px?: import("@codecademy/variance/dist/types/config").Scale<{
+    px?: import("@codecademy/variance").Scale<{
         readonly property: "padding";
         readonly properties: {
             readonly physical: readonly ["paddingLeft", "paddingRight"];
@@ -135,7 +135,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly scale: "spacing";
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    py?: import("@codecademy/variance/dist/types/config").Scale<{
+    py?: import("@codecademy/variance").Scale<{
         readonly property: "padding";
         readonly properties: {
             readonly physical: readonly ["paddingTop", "paddingBottom"];
@@ -144,7 +144,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly scale: "spacing";
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    pt?: import("@codecademy/variance/dist/types/config").Scale<{
+    pt?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "paddingTop";
             readonly logical: "paddingBlockStart";
@@ -152,7 +152,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly scale: "spacing";
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    pb?: import("@codecademy/variance/dist/types/config").Scale<{
+    pb?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "paddingBottom";
             readonly logical: "paddingBlockEnd";
@@ -160,7 +160,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly scale: "spacing";
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    pr?: import("@codecademy/variance/dist/types/config").Scale<{
+    pr?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "paddingRight";
             readonly logical: "paddingInlineEnd";
@@ -168,7 +168,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly scale: "spacing";
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    pl?: import("@codecademy/variance/dist/types/config").Scale<{
+    pl?: import("@codecademy/variance").Scale<{
         readonly property: {
             readonly physical: "paddingLeft";
             readonly logical: "paddingInlineStart";
@@ -176,7 +176,7 @@ export declare const PatternBackdrop: import("react").ForwardRefExoticComponent<
         readonly scale: "spacing";
         readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
-    dimensions?: import("@codecademy/variance/dist/types/config").Scale<{
+    dimensions?: import("@codecademy/variance").Scale<{
         readonly property: "width";
         readonly properties: {
             readonly physical: readonly ["width", "height"];

package/dist/Popover/Popover.js

@@ -2,7 +2,7 @@ import { useElementDir, useLogicalProperties } from '@codecademy/gamut-styles';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useWindowScroll, useWindowSize } from 'react-use';
 import { FocusTrap } from '../FocusTrap';
-import { useResizingParentEffect, useScrollingParentsEffect } from '../PopoverContainer/hooks';
+import { getRefElement, useResizingParentEffect, useScrollingParentsEffect } from '../PopoverContainer/hooks';
 import { Beak, BeakBox, PatternContainer, PopoverContainer, PopoverPortal, RaisedDiv } from './elements';
 import { getBeakVariant } from './styles/beak';
 import { getDefaultOffset, resolveHorizontalSideForRtl } from './utils';
@@ -113,10 +113,10 @@ export const Popover = ({
     };
   }, [horizontalOffset, popoverHeight, popoverWidth, position, resolvedSideAlign, targetRect, verticalOffset]);
   useEffect(() => {
-    setTargetRect(targetRef?.current?.getBoundingClientRect());
+    setTargetRect(getRefElement(targetRef)?.getBoundingClientRect());
   }, [targetRef, isOpen, width, height, x, y]);
   const updateTargetPosition = useCallback(rect => {
-    const target = targetRef?.current;
+    const target = getRefElement(targetRef);
     if (!target) return;
     const newRect = rect || target.getBoundingClientRect();
     setTargetRect(newRect);
@@ -132,7 +132,7 @@ export const Popover = ({
   }, [targetRect, isInViewport, onRequestClose]);
   const handleClickOutside = useCallback(e => {
     const target = e.target;
-    const targetElement = targetRef.current;
+    const targetElement = getRefElement(targetRef);
     if (!targetElement) return;
 
     /**
@@ -142,7 +142,7 @@ export const Popover = ({
     if (targetElement.contains(target)) return;
     onRequestClose?.();
   }, [onRequestClose, targetRef]);
-  if ((!isOpen || !targetRef) && !animation) return null;
+  if ((!isOpen || !targetRef.current) && !animation) return null;
   const alignment = (variant === 'primary' || beak) && beak !== 'center' ? 'aligned' : 'centered';
   const contents = /*#__PURE__*/_jsxs(PopoverContainer, {
     align: resolvedSideAlign,
@@ -187,7 +187,7 @@ export const Popover = ({
   });
   return /*#__PURE__*/_jsx(PopoverPortal, {
     animation: animation,
-    isOpen: Boolean(isOpen && targetRef),
+    isOpen: Boolean(isOpen && targetRef.current),
     children: skipFocusTrap ? /*#__PURE__*/_jsx(_Fragment, {
       children: contents
     }) : /*#__PURE__*/_jsx(FocusTrap, {

package/dist/Popover/types.d.ts

@@ -1,5 +1,5 @@
 import { PatternProps } from '@codecademy/gamut-patterns';
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, type RefObject } from 'react';
 import { PopoverVariants } from './elements';
 export type FocusTrapPopoverProps = {
     /**
@@ -90,12 +90,13 @@ export type PopoverProps = PopoverBaseProps & PopoverVariants & Pick<HTMLAttribu
     isOpen: boolean;
     /**
      * The target element around which the popover will be positioned.
+     * Only ref objects (e.g. from useRef) are supported at runtime; RefCallback is not.
      */
-    targetRef: React.RefObject<Pick<HTMLDivElement, 'getBoundingClientRect' | 'contains'>>;
+    targetRef: RefObject<HTMLElement | null>;
     /**
      * The PopoverContainer which contents will be rendered into.
      */
-    popoverContainerRef?: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;
+    popoverContainerRef?: React.Ref<HTMLDivElement | null>;
     /**
      * Whether to add width restrictions to Popover.
      */

package/dist/PopoverContainer/PopoverContainer.js

@@ -6,7 +6,7 @@ import * as React from 'react';
 import { useWindowScroll, useWindowSize } from 'react-use';
 import { BodyPortal } from '../BodyPortal';
 import { FocusTrap } from '../FocusTrap';
-import { useResizingParentEffect, useScrollingParents, useScrollingParentsEffect } from './hooks';
+import { getRefElement, getTargetAsElement, useResizingParentEffect, useScrollingParents, useScrollingParentsEffect } from './hooks';
 import { getContainers, getPosition, isOutOfView } from './utils';
 import { jsx as _jsx } from "react/jsx-runtime";
 const PopoverContent = /*#__PURE__*/_styled("div", {
@@ -16,7 +16,7 @@ const PopoverContent = /*#__PURE__*/_styled("div", {
   transform: {
     property: 'transform'
   }
-})), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9Qb3BvdmVyQ29udGFpbmVyL1BvcG92ZXJDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCdUIiLCJmaWxlIjoiLi4vLi4vc3JjL1BvcG92ZXJDb250YWluZXIvUG9wb3ZlckNvbnRhaW5lci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBlbGVtZW50RGlyLCBzeXN0ZW0sIHVzZUVsZW1lbnREaXIgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgdmFyaWFuY2UgfSBmcm9tICdAY29kZWNhZGVteS92YXJpYW5jZSc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VNZW1vLCB1c2VSZWYsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgdXNlV2luZG93U2Nyb2xsLCB1c2VXaW5kb3dTaXplIH0gZnJvbSAncmVhY3QtdXNlJztcblxuaW1wb3J0IHsgQm9keVBvcnRhbCB9IGZyb20gJy4uL0JvZHlQb3J0YWwnO1xuaW1wb3J0IHsgRm9jdXNUcmFwIH0gZnJvbSAnLi4vRm9jdXNUcmFwJztcbmltcG9ydCB7XG4gIHVzZVJlc2l6aW5nUGFyZW50RWZmZWN0LFxuICB1c2VTY3JvbGxpbmdQYXJlbnRzLFxuICB1c2VTY3JvbGxpbmdQYXJlbnRzRWZmZWN0LFxufSBmcm9tICcuL2hvb2tzJztcbmltcG9ydCB7IENvbnRhaW5lclN0YXRlLCBQb3BvdmVyQ29udGFpbmVyUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcbmltcG9ydCB7IGdldENvbnRhaW5lcnMsIGdldFBvc2l0aW9uLCBpc091dE9mVmlldyB9IGZyb20gJy4vdXRpbHMnO1xuXG5jb25zdCBQb3BvdmVyQ29udGVudCA9IHN0eWxlZC5kaXYoXG4gIHZhcmlhbmNlLmNvbXBvc2UoXG4gICAgc3lzdGVtLnBvc2l0aW9uaW5nLFxuICAgIHZhcmlhbmNlLmNyZWF0ZSh7XG4gICAgICB0cmFuc2Zvcm06IHtcbiAgICAgICAgcHJvcGVydHk6ICd0cmFuc2Zvcm0nLFxuICAgICAgfSxcbiAgICB9KVxuICApXG4pO1xuXG5leHBvcnQgY29uc3QgUG9wb3ZlckNvbnRhaW5lcjogUmVhY3QuRkM8UG9wb3ZlckNvbnRhaW5lclByb3BzPiA9ICh7XG4gIGFsaWdubWVudCA9ICdib3R0b20tbGVmdCcsXG4gIG9mZnNldCA9IDIwLFxuICB5ID0gMCxcbiAgeCA9IDAsXG4gIGludmVydEF4aXMsXG4gIGlubGluZSA9IGZhbHNlLFxuICBpc09wZW4sXG4gIG9uUmVxdWVzdENsb3NlLFxuICB0YXJnZXRSZWYsXG4gIGFsbG93UGFnZUludGVyYWN0aW9uLFxuICBjbG9zZU9uVmlld3BvcnRFeGl0ID0gZmFsc2UsXG4gIGZvY3VzT25Qcm9wcyxcbiAgLi4ucmVzdFxufSkgPT4ge1xuICBjb25zdCBwb3BvdmVyUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50PihudWxsKTtcbiAgY29uc3QgaGFzUmVxdWVzdGVkQ2xvc2VSZWYgPSB1c2VSZWYoZmFsc2UpO1xuICBjb25zdCBvblJlcXVlc3RDbG9zZVJlZiA9IHVzZVJlZihvblJlcXVlc3RDbG9zZSk7XG4gIGNvbnN0IHsgd2lkdGg6IHdpblcsIGhlaWdodDogd2luSCB9ID0gdXNlV2luZG93U2l6ZSgpO1xuICBjb25zdCB7IHg6IHdpblgsIHk6IHdpblkgfSA9IHVzZVdpbmRvd1Njcm9sbCgpO1xuICBjb25zdCBbY29udGFpbmVycywgc2V0Q29udGFpbmVyc10gPSB1c2VTdGF0ZTxDb250YWluZXJTdGF0ZT4oKTtcbiAgY29uc3QgW3RhcmdldFJlY3QsIHNldFRhcmdldFJlY3RdID0gdXNlU3RhdGU8RE9NUmVjdD4oKTtcbiAgY29uc3QgcGFyZW50ID0gY29udGFpbmVycz8ucGFyZW50O1xuXG4gIC8vIE1lbW9pemUgc2Nyb2xsaW5nIHBhcmVudHMgdG8gYXZvaWQgZXhwZW5zaXZlIERPTSB0cmF2ZXJzYWxzXG4gIGNvbnN0IHNjcm9sbGluZ1BhcmVudHMgPSB1c2VTY3JvbGxpbmdQYXJlbnRzKHRhcmdldFJlZik7XG5cbiAgLy8gS2VlcCBvblJlcXVlc3RDbG9zZSByZWYgdXAgdG8gZGF0ZVxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIG9uUmVxdWVzdENsb3NlUmVmLmN1cnJlbnQgPSBvblJlcXVlc3RDbG9zZTtcbiAgfSwgW29uUmVxdWVzdENsb3NlXSk7XG5cbiAgY29uc3QgdGFyZ2V0RGlyID0gdXNlRWxlbWVudERpcih0YXJnZXRSZWYpO1xuXG4gIGNvbnN0IHRhcmdldEVsID0gdGFyZ2V0UmVmPy5jdXJyZW50O1xuICAvKipcbiAgICogU2VlIHtAbGluayBnZXRDb250YWluZXJzfSBmb3IgbW9yZSBpbmZvcm1hdGlvblxuICAgKiBJbmxpbmU6IGBsYXlvdXRTb3VyY2VgIGlzIGRlcml2ZWQgZnJvbSBgb2Zmc2V0UGFyZW50YC5cbiAgICogUG9ydGFsOiBpLmUuIGlzbid0IGlubGluZSBzbyB3ZSBjYW4gdXNlIHRoZSB0YXJnZXQgaXRzZWxmLlxuICAgKi9cbiAgY29uc3QgbGF5b3V0U291cmNlID1cbiAgICBpbmxpbmUgJiYgdGFyZ2V0RWw/Lm9mZnNldFBhcmVudCBpbnN0YW5jZW9mIEVsZW1lbnRcbiAgICAgID8gdGFyZ2V0RWwub2Zmc2V0UGFyZW50XG4gICAgICA6IHRhcmdldEVsO1xuICBjb25zdCBpc1J0bCA9IGlubGluZVxuICAgID8gbGF5b3V0U291cmNlIGluc3RhbmNlb2YgRWxlbWVudCAmJiBlbGVtZW50RGlyKGxheW91dFNvdXJjZSkgPT09ICdydGwnXG4gICAgOiB0YXJnZXREaXIgPT09ICdydGwnO1xuXG4gIGNvbnN0IHBvcG92ZXJQb3NpdGlvbiA9IHVzZU1lbW8oKCkgPT4ge1xuICAgIGlmIChwYXJlbnQgIT09IHVuZGVmaW5lZCkge1xuICAgICAgcmV0dXJuIGdldFBvc2l0aW9uKHtcbiAgICAgICAgYWxpZ25tZW50LFxuICAgICAgICBjb250YWluZXI6IHBhcmVudCxcbiAgICAgICAgaW52ZXJ0QXhpcyxcbiAgICAgICAgaXNSdGwsXG4gICAgICAgIG9mZnNldCxcbiAgICAgICAgeCxcbiAgICAgICAgeSxcbiAgICAgIH0pO1xuICAgIH1cbiAgICByZXR1cm4geyBzdHlsZXM6IHt9LCBkaXJOZXV0cmFsU3R5bGVzOiB1bmRlZmluZWQgfTtcbiAgfSwgW3BhcmVudCwgeCwgeSwgb2Zmc2V0LCBhbGlnbm1lbnQsIGludmVydEF4aXMsIGlzUnRsXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBjb25zdCB0YXJnZXQgPSB0YXJnZXRSZWY/LmN1cnJlbnQ7XG4gICAgaWYgKCF0YXJnZXQpIHJldHVybjtcbiAgICBzZXRDb250YWluZXJzKGdldENvbnRhaW5lcnModGFyZ2V0LCBpbmxpbmUsIHsgeDogd2luWCwgeTogd2luWSB9KSk7XG4gIH0sIFt0YXJnZXRSZWYsIGlubGluZSwgd2luVywgd2luSCwgd2luWCwgd2luWSwgdGFyZ2V0UmVjdF0pO1xuXG4gIC8vIFVwZGF0ZSB0YXJnZXQgcmVjdGFuZ2xlIHdoZW4gd2luZG93IHNpemUvc2Nyb2xsIGNoYW5nZXNcbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBzZXRUYXJnZXRSZWN0KHRhcmdldFJlZj8uY3VycmVudD8uZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkpO1xuICB9LCBbdGFyZ2V0UmVmLCBpc09wZW4sIHdpblcsIHdpbkgsIHdpblgsIHdpblldKTtcblxuICAvLyBVcGRhdGUgdGFyZ2V0IHJlY3RhbmdsZSB3aGVuIHBhcmVudCBzaXplL3Njcm9sbCBjaGFuZ2VzXG4gIGNvbnN0IHVwZGF0ZVRhcmdldFBvc2l0aW9uID0gdXNlQ2FsbGJhY2soXG4gICAgKHJlY3Q/OiBET01SZWN0KSA9PiB7XG4gICAgICBjb25zdCB0YXJnZXQgPSB0YXJnZXRSZWY/LmN1cnJlbnQ7XG4gICAgICBpZiAoIXRhcmdldCkgcmV0dXJuO1xuXG4gICAgICBjb25zdCBuZXdSZWN0ID0gcmVjdCB8fCB0YXJnZXQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG4gICAgICBzZXRUYXJnZXRSZWN0KG5ld1JlY3QpO1xuXG4gICAgICBjb25zdCBjdXJyZW50U2Nyb2xsWCA9XG4gICAgICAgIHdpbmRvdy5wYWdlWE9mZnNldCB8fCBkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuc2Nyb2xsTGVmdDtcbiAgICAgIGNvbnN0IGN1cnJlbnRTY3JvbGxZID1cbiAgICAgICAgd2luZG93LnBhZ2VZT2Zmc2V0IHx8IGRvY3VtZW50LmRvY3VtZW50RWxlbWVudC5zY3JvbGxUb3A7XG5cbiAgICAgIHNldENvbnRhaW5lcnMoXG4gICAgICAgIGdldENvbnRhaW5lcnModGFyZ2V0LCBpbmxpbmUsIHsgeDogY3VycmVudFNjcm9sbFgsIHk6IGN1cnJlbnRTY3JvbGxZIH0pXG4gICAgICApO1xuICAgIH0sXG4gICAgW3RhcmdldFJlZiwgaW5saW5lXVxuICApO1xuXG4gIHVzZVNjcm9sbGluZ1BhcmVudHNFZmZlY3QodGFyZ2V0UmVmLCB1cGRhdGVUYXJnZXRQb3NpdGlvbik7XG5cbiAgdXNlUmVzaXppbmdQYXJlbnRFZmZlY3QodGFyZ2V0UmVmLCBzZXRUYXJnZXRSZWN0KTtcblxuICAvLyBIYW5kbGUgY2xvc2VPblZpZXdwb3J0RXhpdCB3aXRoIGNhY2hlZCBzY3JvbGxpbmcgcGFyZW50cyBmb3IgcGVyZm9ybWFuY2VcbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAoIWNsb3NlT25WaWV3cG9ydEV4aXQpIHJldHVybjtcblxuICAgIGNvbnN0IHJlY3QgPSB0YXJnZXRSZWN0IHx8IGNvbnRhaW5lcnM/LnZpZXdwb3J0O1xuICAgIGlmICghcmVjdCkgcmV0dXJuO1xuXG4gICAgY29uc3QgaXNPdXQgPSBpc091dE9mVmlldyhcbiAgICAgIHJlY3QsXG4gICAgICB0YXJnZXRSZWY/LmN1cnJlbnQgYXMgSFRNTEVsZW1lbnQsXG4gICAgICBzY3JvbGxpbmdQYXJlbnRzXG4gICAgKTtcblxuICAgIGlmIChpc091dCAmJiAhaGFzUmVxdWVzdGVkQ2xvc2VSZWYuY3VycmVudCkge1xuICAgICAgaGFzUmVxdWVzdGVkQ2xvc2VSZWYuY3VycmVudCA9IHRydWU7XG4gICAgICBvblJlcXVlc3RDbG9zZVJlZi5jdXJyZW50Py4oKTtcbiAgICB9IGVsc2UgaWYgKCFpc091dCkge1xuICAgICAgaGFzUmVxdWVzdGVkQ2xvc2VSZWYuY3VycmVudCA9IGZhbHNlO1xuICAgIH1cbiAgfSwgW1xuICAgIHRhcmdldFJlY3QsXG4gICAgY29udGFpbmVycz8udmlld3BvcnQsXG4gICAgdGFyZ2V0UmVmLFxuICAgIGNsb3NlT25WaWV3cG9ydEV4aXQsXG4gICAgc2Nyb2xsaW5nUGFyZW50cyxcbiAgXSk7XG4gIC8qKlxuICAgKiBBbGxvd3MgdGFyZ2V0UmVmIHRvIGJlIG9yIGNvbnRhaW4gYSBidXR0b24gdGhhdCB0b2dnbGVzIHRoZSBwb3BvdmVyIG9wZW4gYW5kIGNsb3NlZC5cbiAgICogV2l0aG91dCB0aGlzIGNoZWNrIGl0IHdvdWxkIHRvZ2dsZSBjbG9zZWQgdGhlbiBiYWNrIG9wZW4gaW1tZWRpYXRlbHkuXG4gICAqL1xuICBjb25zdCBoYW5kbGVDbGlja091dHNpZGUgPSB1c2VDYWxsYmFjayhcbiAgICAoZTogTW91c2VFdmVudCB8IFRvdWNoRXZlbnQpID0+IHtcbiAgICAgIGNvbnN0IHRhcmdldCA9IGUudGFyZ2V0IGFzIE5vZGU7XG4gICAgICBjb25zdCB0YXJnZXRFbGVtZW50ID0gdGFyZ2V0UmVmLmN1cnJlbnQ7XG5cbiAgICAgIGlmICghdGFyZ2V0RWxlbWVudCkgcmV0dXJuO1xuICAgICAgaWYgKHRhcmdldEVsZW1lbnQuY29udGFpbnModGFyZ2V0KSkgcmV0dXJuO1xuICAgICAgaWYgKHBvcG92ZXJSZWYuY3VycmVudD8uY29udGFpbnModGFyZ2V0KSkgcmV0dXJuO1xuXG4gICAgICAvLyBJZiB3ZSBnZXQgaGVyZSwgaXQncyBhIGdlbnVpbmUgb3V0c2lkZSBjbGlja1xuICAgICAgb25SZXF1ZXN0Q2xvc2U/LigpO1xuICAgIH0sXG4gICAgW29uUmVxdWVzdENsb3NlLCB0YXJnZXRSZWZdXG4gICk7XG5cbiAgLyoqXG4gICAqIEJhY2t1cCBjbGljayBvdXRzaWRlIGhhbmRsZXIgZm9yIGNhc2VzIHdoZXJlIEZvY3VzVHJhcCBkZXRlY3Rpb24gbWlnaHQgYmUgaW50ZXJmZXJlZCB3aXRoXG4gICAqIGJ5IG91ciBvd24gZmxvYXRpbmcgZWxlbWVudHNcbiAgICovXG4gIGNvbnN0IGhhbmRsZUdsb2JhbENsaWNrT3V0c2lkZSA9IHVzZUNhbGxiYWNrKFxuICAgIChlOiBNb3VzZUV2ZW50KSA9PiB7XG4gICAgICBjb25zdCB0YXJnZXQgPSBlLnRhcmdldCBhcyBOb2RlO1xuICAgICAgY29uc3QgdGFyZ2V0RWxlbWVudCA9IHRhcmdldFJlZi5jdXJyZW50O1xuXG4gICAgICBpZiAoIXRhcmdldEVsZW1lbnQgfHwgIWlzT3BlbikgcmV0dXJuO1xuXG4gICAgICBpZiAoXG4gICAgICAgIHRhcmdldEVsZW1lbnQuY29udGFpbnModGFyZ2V0KSB8fFxuICAgICAgICBwb3BvdmVyUmVmLmN1cnJlbnQ/LmNvbnRhaW5zKHRhcmdldClcbiAgICAgIClcbiAgICAgICAgcmV0dXJuO1xuXG4gICAgICAvLyBDaGVjayBpZiB0aGUgY2xpY2tlZCBlbGVtZW50IGlzIHdpdGhpbiBhbiBPdmVybGF5IGNvbXBvbmVudFxuICAgICAgY29uc3QgY2xpY2tlZEVsZW1lbnQgPSB0YXJnZXQgYXMgRWxlbWVudDtcbiAgICAgIGlmIChjbGlja2VkRWxlbWVudC5jbG9zZXN0KCdbZGF0YS1mbG9hdGluZz1cIm92ZXJsYXlcIl0nKSkge1xuICAgICAgICByZXR1cm47XG4gICAgICB9XG5cbiAgICAgIC8vIENoZWNrIGlmIHRoZSBjbGlja2VkIGVsZW1lbnQgaXMgd2l0aGluIGFub3RoZXIgUG9wb3ZlciBvciBQb3BvdmVyQ29udGFpbmVyXG4gICAgICBjb25zdCBpc0Zsb2F0aW5nRWxlbWVudCA9IGNsaWNrZWRFbGVtZW50LmNsb3Nlc3QoXG4gICAgICAgICdbZGF0YS1mbG9hdGluZz1cInBvcG92ZXJcIl0nXG4gICAgICApO1xuICAgICAgaWYgKFxuICAgICAgICBpc0Zsb2F0aW5nRWxlbWVudCAmJlxuICAgICAgICAhcG9wb3ZlclJlZi5jdXJyZW50Py5jb250YWlucyhpc0Zsb2F0aW5nRWxlbWVudClcbiAgICAgICkge1xuICAgICAgICBvblJlcXVlc3RDbG9zZT8uKCk7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cblxuICAgICAgb25SZXF1ZXN0Q2xvc2U/LigpO1xuICAgIH0sXG4gICAgW29uUmVxdWVzdENsb3NlLCB0YXJnZXRSZWYsIGlzT3Blbl1cbiAgKTtcblxuICAvLyBCYWNrdXAgZ2xvYmFsIGNsaWNrIGxpc3RlbmVyIGZvciB3aGVuIGEgUG9wb3ZlciBvciBQb3BvdmVyQ29udGFpbmVyIGlzIG9wZW5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAoaXNPcGVuKSB7XG4gICAgICAvLyBVc2UgYSBzbWFsbCBkZWxheSB0byBlbnN1cmUgdGhpcyBkb2Vzbid0IGludGVyZmVyZSB3aXRoIHRoZSBGb2N1c1RyYXAncyBvd24gZGV0ZWN0aW9uXG4gICAgICBjb25zdCB0aW1lb3V0SWQgPSBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlR2xvYmFsQ2xpY2tPdXRzaWRlLCB0cnVlKTtcbiAgICAgIH0sIDUwKTtcblxuICAgICAgcmV0dXJuICgpID0+IHtcbiAgICAgICAgY2xlYXJUaW1lb3V0KHRpbWVvdXRJZCk7XG4gICAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoXG4gICAgICAgICAgJ21vdXNlZG93bicsXG4gICAgICAgICAgaGFuZGxlR2xvYmFsQ2xpY2tPdXRzaWRlLFxuICAgICAgICAgIHRydWVcbiAgICAgICAgKTtcbiAgICAgIH07XG4gICAgfVxuICB9LCBbaXNPcGVuLCBoYW5kbGVHbG9iYWxDbGlja091dHNpZGVdKTtcblxuICBpZiAoIWlzT3BlbiB8fCAhdGFyZ2V0UmVmKSByZXR1cm4gbnVsbDtcblxuICBjb25zdCB7XG4gICAgY2hpbGRyZW4sXG4gICAgc3R5bGU6IHJlc3RTdHlsZSxcbiAgICAuLi5yZXN0UHJvcHNcbiAgfSA9IHJlc3QgYXMgUmVhY3QuSFRNTEF0dHJpYnV0ZXM8SFRNTERpdkVsZW1lbnQ+O1xuXG4gIGNvbnN0IHsgZGlyTmV1dHJhbFN0eWxlcywgc3R5bGVzOiBwbGFjZW1lbnRTdHlsZXMgfSA9IHBvcG92ZXJQb3NpdGlvbjtcblxuICAvKipcbiAgICogTm9uLWVtcHR5IGBwbGFjZW1lbnRTdHlsZXNgIG1lcmdlZCBpbnRvIGlubGluZSBgc3R5bGVgXG4gICAqIGRpck5ldXRyYWxTdHlsZXNgIGxheWVyZWQgbGFzdCwgc2VlIHtAbGluayBnZXRQb3NpdGlvbn1cbiAgICovXG4gIGNvbnN0IHBsYWNlbWVudFN0eWxlc1RvTWVyZ2UgPVxuICAgIE9iamVjdC5rZXlzKHBsYWNlbWVudFN0eWxlcykubGVuZ3RoID4gMCA/IHBsYWNlbWVudFN0eWxlcyA6IG51bGw7XG5cbiAgY29uc3QgaGFzTWVyZ2VkU3R5bGUgPSBCb29sZWFuKFxuICAgIHJlc3RTdHlsZSB8fCBkaXJOZXV0cmFsU3R5bGVzIHx8IHBsYWNlbWVudFN0eWxlc1RvTWVyZ2VcbiAgKTtcbiAgY29uc3QgbWVyZ2VkU3R5bGUgPSBoYXNNZXJnZWRTdHlsZVxuICAgID8ge1xuICAgICAgICAuLi4odHlwZW9mIHJlc3RTdHlsZSA9PT0gJ29iamVjdCcgJiYgcmVzdFN0eWxlID8gcmVzdFN0eWxlIDoge30pLFxuICAgICAgICAuLi4ocGxhY2VtZW50U3R5bGVzVG9NZXJnZSA/PyB7fSksXG4gICAgICAgIC4uLmRpck5ldXRyYWxTdHlsZXMsXG4gICAgICB9XG4gICAgOiB1bmRlZmluZWQ7XG5cbiAgY29uc3QgY29udGVudCA9IChcbiAgICA8Rm9jdXNUcmFwXG4gICAgICBhbGxvd1BhZ2VJbnRlcmFjdGlvbj17aW5saW5lIHx8IGFsbG93UGFnZUludGVyYWN0aW9ufVxuICAgICAgZm9jdXNPblByb3BzPXtmb2N1c09uUHJvcHN9XG4gICAgICBvbkNsaWNrT3V0c2lkZT17aGFuZGxlQ2xpY2tPdXRzaWRlfVxuICAgICAgb25Fc2NhcGVLZXk9e29uUmVxdWVzdENsb3NlfVxuICAgID5cbiAgICAgIDxQb3BvdmVyQ29udGVudFxuICAgICAgICBkYXRhLWZsb2F0aW5nPVwicG9wb3ZlclwiXG4gICAgICAgIGRhdGEtdGVzdGlkPVwicG9wb3Zlci1jb250ZW50LWNvbnRhaW5lclwiXG4gICAgICAgIHBvc2l0aW9uPVwiYWJzb2x1dGVcIlxuICAgICAgICByZWY9e3BvcG92ZXJSZWZ9XG4gICAgICAgIC8qIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBnYW11dC9uby1pbmxpbmUtc3R5bGUgKi9cbiAgICAgICAgc3R5bGU9e21lcmdlZFN0eWxlfVxuICAgICAgICB0YWJJbmRleD17LTF9XG4gICAgICAgIHpJbmRleD17aW5saW5lID8gNSA6ICdpbml0aWFsJ31cbiAgICAgICAgey4uLnJlc3RQcm9wc31cbiAgICAgID5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgPC9Qb3BvdmVyQ29udGVudD5cbiAgICA8L0ZvY3VzVHJhcD5cbiAgKTtcblxuICBpZiAoaW5saW5lKSByZXR1cm4gY29udGVudDtcblxuICByZXR1cm4gPEJvZHlQb3J0YWw+e2NvbnRlbnR9PC9Cb2R5UG9ydGFsPjtcbn07XG4iXX0= */");
+})), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9Qb3BvdmVyQ29udGFpbmVyL1BvcG92ZXJDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1CdUIiLCJmaWxlIjoiLi4vLi4vc3JjL1BvcG92ZXJDb250YWluZXIvUG9wb3ZlckNvbnRhaW5lci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBlbGVtZW50RGlyLCBzeXN0ZW0sIHVzZUVsZW1lbnREaXIgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgdmFyaWFuY2UgfSBmcm9tICdAY29kZWNhZGVteS92YXJpYW5jZSc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VDYWxsYmFjaywgdXNlRWZmZWN0LCB1c2VNZW1vLCB1c2VSZWYsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgdXNlV2luZG93U2Nyb2xsLCB1c2VXaW5kb3dTaXplIH0gZnJvbSAncmVhY3QtdXNlJztcblxuaW1wb3J0IHsgQm9keVBvcnRhbCB9IGZyb20gJy4uL0JvZHlQb3J0YWwnO1xuaW1wb3J0IHsgRm9jdXNUcmFwIH0gZnJvbSAnLi4vRm9jdXNUcmFwJztcbmltcG9ydCB7XG4gIGdldFJlZkVsZW1lbnQsXG4gIGdldFRhcmdldEFzRWxlbWVudCxcbiAgdXNlUmVzaXppbmdQYXJlbnRFZmZlY3QsXG4gIHVzZVNjcm9sbGluZ1BhcmVudHMsXG4gIHVzZVNjcm9sbGluZ1BhcmVudHNFZmZlY3QsXG59IGZyb20gJy4vaG9va3MnO1xuaW1wb3J0IHsgQ29udGFpbmVyU3RhdGUsIFBvcG92ZXJDb250YWluZXJQcm9wcywgVGFyZ2V0UmVmIH0gZnJvbSAnLi90eXBlcyc7XG5pbXBvcnQgeyBnZXRDb250YWluZXJzLCBnZXRQb3NpdGlvbiwgaXNPdXRPZlZpZXcgfSBmcm9tICcuL3V0aWxzJztcblxuY29uc3QgUG9wb3ZlckNvbnRlbnQgPSBzdHlsZWQuZGl2KFxuICB2YXJpYW5jZS5jb21wb3NlKFxuICAgIHN5c3RlbS5wb3NpdGlvbmluZyxcbiAgICB2YXJpYW5jZS5jcmVhdGUoe1xuICAgICAgdHJhbnNmb3JtOiB7XG4gICAgICAgIHByb3BlcnR5OiAndHJhbnNmb3JtJyxcbiAgICAgIH0sXG4gICAgfSlcbiAgKVxuKTtcblxuZXhwb3J0IGNvbnN0IFBvcG92ZXJDb250YWluZXI6IFJlYWN0LkZDPFBvcG92ZXJDb250YWluZXJQcm9wcz4gPSAoe1xuICBhbGlnbm1lbnQgPSAnYm90dG9tLWxlZnQnLFxuICBvZmZzZXQgPSAyMCxcbiAgeSA9IDAsXG4gIHggPSAwLFxuICBpbnZlcnRBeGlzLFxuICBpbmxpbmUgPSBmYWxzZSxcbiAgaXNPcGVuLFxuICBvblJlcXVlc3RDbG9zZSxcbiAgdGFyZ2V0UmVmLFxuICBhbGxvd1BhZ2VJbnRlcmFjdGlvbixcbiAgY2xvc2VPblZpZXdwb3J0RXhpdCA9IGZhbHNlLFxuICBmb2N1c09uUHJvcHMsXG4gIC4uLnJlc3Rcbn0pID0+IHtcbiAgY29uc3QgcG9wb3ZlclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IGhhc1JlcXVlc3RlZENsb3NlUmVmID0gdXNlUmVmKGZhbHNlKTtcbiAgY29uc3Qgb25SZXF1ZXN0Q2xvc2VSZWYgPSB1c2VSZWYob25SZXF1ZXN0Q2xvc2UpO1xuICBjb25zdCB7IHdpZHRoOiB3aW5XLCBoZWlnaHQ6IHdpbkggfSA9IHVzZVdpbmRvd1NpemUoKTtcbiAgY29uc3QgeyB4OiB3aW5YLCB5OiB3aW5ZIH0gPSB1c2VXaW5kb3dTY3JvbGwoKTtcbiAgY29uc3QgW2NvbnRhaW5lcnMsIHNldENvbnRhaW5lcnNdID0gdXNlU3RhdGU8Q29udGFpbmVyU3RhdGU+KCk7XG4gIGNvbnN0IFt0YXJnZXRSZWN0LCBzZXRUYXJnZXRSZWN0XSA9IHVzZVN0YXRlPERPTVJlY3Q+KCk7XG4gIGNvbnN0IHBhcmVudCA9IGNvbnRhaW5lcnM/LnBhcmVudDtcblxuICAvLyBNZW1vaXplIHNjcm9sbGluZyBwYXJlbnRzIHRvIGF2b2lkIGV4cGVuc2l2ZSBET00gdHJhdmVyc2Fsc1xuICBjb25zdCBzY3JvbGxpbmdQYXJlbnRzID0gdXNlU2Nyb2xsaW5nUGFyZW50cyh0YXJnZXRSZWYpO1xuXG4gIC8vIEtlZXAgb25SZXF1ZXN0Q2xvc2UgcmVmIHVwIHRvIGRhdGVcbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBvblJlcXVlc3RDbG9zZVJlZi5jdXJyZW50ID0gb25SZXF1ZXN0Q2xvc2U7XG4gIH0sIFtvblJlcXVlc3RDbG9zZV0pO1xuXG4gIGNvbnN0IHRhcmdldERpciA9IHVzZUVsZW1lbnREaXIodGFyZ2V0UmVmKTtcblxuICBjb25zdCB0YXJnZXRFbCA9IHRhcmdldFJlZj8uY3VycmVudDtcbiAgLyoqXG4gICAqIFNlZSB7QGxpbmsgZ2V0Q29udGFpbmVyc30gZm9yIG1vcmUgaW5mb3JtYXRpb25cbiAgICogSW5saW5lOiBgbGF5b3V0U291cmNlYCBpcyBkZXJpdmVkIGZyb20gYG9mZnNldFBhcmVudGAuXG4gICAqIFBvcnRhbDogaS5lLiBpc24ndCBpbmxpbmUgc28gd2UgY2FuIHVzZSB0aGUgdGFyZ2V0IGl0c2VsZi5cbiAgICovXG4gIGNvbnN0IGxheW91dFNvdXJjZSA9XG4gICAgaW5saW5lICYmIHRhcmdldEVsPy5vZmZzZXRQYXJlbnQgaW5zdGFuY2VvZiBFbGVtZW50XG4gICAgICA/IHRhcmdldEVsLm9mZnNldFBhcmVudFxuICAgICAgOiB0YXJnZXRFbDtcbiAgY29uc3QgaXNSdGwgPSBpbmxpbmVcbiAgICA/IGxheW91dFNvdXJjZSBpbnN0YW5jZW9mIEVsZW1lbnQgJiYgZWxlbWVudERpcihsYXlvdXRTb3VyY2UpID09PSAncnRsJ1xuICAgIDogdGFyZ2V0RGlyID09PSAncnRsJztcblxuICBjb25zdCBwb3BvdmVyUG9zaXRpb24gPSB1c2VNZW1vKCgpID0+IHtcbiAgICBpZiAocGFyZW50ICE9PSB1bmRlZmluZWQpIHtcbiAgICAgIHJldHVybiBnZXRQb3NpdGlvbih7XG4gICAgICAgIGFsaWdubWVudCxcbiAgICAgICAgY29udGFpbmVyOiBwYXJlbnQsXG4gICAgICAgIGludmVydEF4aXMsXG4gICAgICAgIGlzUnRsLFxuICAgICAgICBvZmZzZXQsXG4gICAgICAgIHgsXG4gICAgICAgIHksXG4gICAgICB9KTtcbiAgICB9XG4gICAgcmV0dXJuIHsgc3R5bGVzOiB7fSwgZGlyTmV1dHJhbFN0eWxlczogdW5kZWZpbmVkIH07XG4gIH0sIFtwYXJlbnQsIHgsIHksIG9mZnNldCwgYWxpZ25tZW50LCBpbnZlcnRBeGlzLCBpc1J0bF0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgY29uc3QgdGFyZ2V0ID0gZ2V0UmVmRWxlbWVudCh0YXJnZXRSZWYpO1xuICAgIGlmICghdGFyZ2V0KSByZXR1cm47XG4gICAgc2V0Q29udGFpbmVycyhcbiAgICAgIGdldENvbnRhaW5lcnModGFyZ2V0IGFzIFRhcmdldFJlZiwgaW5saW5lLCB7IHg6IHdpblgsIHk6IHdpblkgfSlcbiAgICApO1xuICB9LCBbdGFyZ2V0UmVmLCBpbmxpbmUsIHdpblcsIHdpbkgsIHdpblgsIHdpblksIHRhcmdldFJlY3RdKTtcblxuICAvLyBVcGRhdGUgdGFyZ2V0IHJlY3RhbmdsZSB3aGVuIHdpbmRvdyBzaXplL3Njcm9sbCBjaGFuZ2VzXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgc2V0VGFyZ2V0UmVjdChnZXRSZWZFbGVtZW50KHRhcmdldFJlZik/LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpKTtcbiAgfSwgW3RhcmdldFJlZiwgaXNPcGVuLCB3aW5XLCB3aW5ILCB3aW5YLCB3aW5ZXSk7XG5cbiAgLy8gVXBkYXRlIHRhcmdldCByZWN0YW5nbGUgd2hlbiBwYXJlbnQgc2l6ZS9zY3JvbGwgY2hhbmdlc1xuICBjb25zdCB1cGRhdGVUYXJnZXRQb3NpdGlvbiA9IHVzZUNhbGxiYWNrKFxuICAgIChyZWN0PzogRE9NUmVjdCkgPT4ge1xuICAgICAgY29uc3QgdGFyZ2V0ID0gZ2V0UmVmRWxlbWVudCh0YXJnZXRSZWYpO1xuICAgICAgaWYgKCF0YXJnZXQpIHJldHVybjtcblxuICAgICAgY29uc3QgbmV3UmVjdCA9IHJlY3QgfHwgdGFyZ2V0LmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICAgICAgc2V0VGFyZ2V0UmVjdChuZXdSZWN0KTtcblxuICAgICAgY29uc3QgY3VycmVudFNjcm9sbFggPVxuICAgICAgICB3aW5kb3cucGFnZVhPZmZzZXQgfHwgZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50LnNjcm9sbExlZnQ7XG4gICAgICBjb25zdCBjdXJyZW50U2Nyb2xsWSA9XG4gICAgICAgIHdpbmRvdy5wYWdlWU9mZnNldCB8fCBkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuc2Nyb2xsVG9wO1xuXG4gICAgICBzZXRDb250YWluZXJzKFxuICAgICAgICBnZXRDb250YWluZXJzKHRhcmdldCBhcyBUYXJnZXRSZWYsIGlubGluZSwge1xuICAgICAgICAgIHg6IGN1cnJlbnRTY3JvbGxYLFxuICAgICAgICAgIHk6IGN1cnJlbnRTY3JvbGxZLFxuICAgICAgICB9KVxuICAgICAgKTtcbiAgICB9LFxuICAgIFt0YXJnZXRSZWYsIGlubGluZV1cbiAgKTtcblxuICB1c2VTY3JvbGxpbmdQYXJlbnRzRWZmZWN0KHRhcmdldFJlZiwgdXBkYXRlVGFyZ2V0UG9zaXRpb24pO1xuICB1c2VSZXNpemluZ1BhcmVudEVmZmVjdCh0YXJnZXRSZWYsIHNldFRhcmdldFJlY3QpO1xuXG4gIC8vIEhhbmRsZSBjbG9zZU9uVmlld3BvcnRFeGl0IHdpdGggY2FjaGVkIHNjcm9sbGluZyBwYXJlbnRzIGZvciBwZXJmb3JtYW5jZVxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmICghY2xvc2VPblZpZXdwb3J0RXhpdCkgcmV0dXJuO1xuXG4gICAgY29uc3QgcmVjdCA9IHRhcmdldFJlY3QgfHwgY29udGFpbmVycz8udmlld3BvcnQ7XG4gICAgaWYgKCFyZWN0KSByZXR1cm47XG5cbiAgICBjb25zdCBpc091dCA9IGlzT3V0T2ZWaWV3KFxuICAgICAgcmVjdCxcbiAgICAgIGdldFRhcmdldEFzRWxlbWVudChnZXRSZWZFbGVtZW50KHRhcmdldFJlZikpID8/IHVuZGVmaW5lZCxcbiAgICAgIHNjcm9sbGluZ1BhcmVudHNcbiAgICApO1xuXG4gICAgaWYgKGlzT3V0ICYmICFoYXNSZXF1ZXN0ZWRDbG9zZVJlZi5jdXJyZW50KSB7XG4gICAgICBoYXNSZXF1ZXN0ZWRDbG9zZVJlZi5jdXJyZW50ID0gdHJ1ZTtcbiAgICAgIG9uUmVxdWVzdENsb3NlUmVmLmN1cnJlbnQ/LigpO1xuICAgIH0gZWxzZSBpZiAoIWlzT3V0KSB7XG4gICAgICBoYXNSZXF1ZXN0ZWRDbG9zZVJlZi5jdXJyZW50ID0gZmFsc2U7XG4gICAgfVxuICB9LCBbXG4gICAgdGFyZ2V0UmVjdCxcbiAgICBjb250YWluZXJzPy52aWV3cG9ydCxcbiAgICB0YXJnZXRSZWYsXG4gICAgY2xvc2VPblZpZXdwb3J0RXhpdCxcbiAgICBzY3JvbGxpbmdQYXJlbnRzLFxuICBdKTtcbiAgLyoqXG4gICAqIEFsbG93cyB0YXJnZXRSZWYgdG8gYmUgb3IgY29udGFpbiBhIGJ1dHRvbiB0aGF0IHRvZ2dsZXMgdGhlIHBvcG92ZXIgb3BlbiBhbmQgY2xvc2VkLlxuICAgKiBXaXRob3V0IHRoaXMgY2hlY2sgaXQgd291bGQgdG9nZ2xlIGNsb3NlZCB0aGVuIGJhY2sgb3BlbiBpbW1lZGlhdGVseS5cbiAgICovXG4gIGNvbnN0IGhhbmRsZUNsaWNrT3V0c2lkZSA9IHVzZUNhbGxiYWNrKFxuICAgIChlOiBNb3VzZUV2ZW50IHwgVG91Y2hFdmVudCkgPT4ge1xuICAgICAgY29uc3QgdGFyZ2V0ID0gZS50YXJnZXQgYXMgTm9kZTtcbiAgICAgIGNvbnN0IHRhcmdldEVsZW1lbnQgPSBnZXRSZWZFbGVtZW50KHRhcmdldFJlZik7XG5cbiAgICAgIGlmICghdGFyZ2V0RWxlbWVudCkgcmV0dXJuO1xuICAgICAgaWYgKHRhcmdldEVsZW1lbnQuY29udGFpbnModGFyZ2V0KSkgcmV0dXJuO1xuICAgICAgaWYgKHBvcG92ZXJSZWYuY3VycmVudD8uY29udGFpbnModGFyZ2V0KSkgcmV0dXJuO1xuXG4gICAgICAvLyBJZiB3ZSBnZXQgaGVyZSwgaXQncyBhIGdlbnVpbmUgb3V0c2lkZSBjbGlja1xuICAgICAgb25SZXF1ZXN0Q2xvc2U/LigpO1xuICAgIH0sXG4gICAgW29uUmVxdWVzdENsb3NlLCB0YXJnZXRSZWZdXG4gICk7XG5cbiAgLyoqXG4gICAqIEJhY2t1cCBjbGljayBvdXRzaWRlIGhhbmRsZXIgZm9yIGNhc2VzIHdoZXJlIEZvY3VzVHJhcCBkZXRlY3Rpb24gbWlnaHQgYmUgaW50ZXJmZXJlZCB3aXRoXG4gICAqIGJ5IG91ciBvd24gZmxvYXRpbmcgZWxlbWVudHNcbiAgICovXG4gIGNvbnN0IGhhbmRsZUdsb2JhbENsaWNrT3V0c2lkZSA9IHVzZUNhbGxiYWNrKFxuICAgIChlOiBNb3VzZUV2ZW50KSA9PiB7XG4gICAgICBjb25zdCB0YXJnZXQgPSBlLnRhcmdldCBhcyBOb2RlO1xuICAgICAgY29uc3QgdGFyZ2V0RWxlbWVudCA9IGdldFJlZkVsZW1lbnQodGFyZ2V0UmVmKTtcblxuICAgICAgaWYgKCF0YXJnZXRFbGVtZW50IHx8ICFpc09wZW4pIHJldHVybjtcblxuICAgICAgaWYgKFxuICAgICAgICB0YXJnZXRFbGVtZW50LmNvbnRhaW5zKHRhcmdldCkgfHxcbiAgICAgICAgcG9wb3ZlclJlZi5jdXJyZW50Py5jb250YWlucyh0YXJnZXQpXG4gICAgICApXG4gICAgICAgIHJldHVybjtcblxuICAgICAgLy8gQ2hlY2sgaWYgdGhlIGNsaWNrZWQgZWxlbWVudCBpcyB3aXRoaW4gYW4gT3ZlcmxheSBjb21wb25lbnRcbiAgICAgIGNvbnN0IGNsaWNrZWRFbGVtZW50ID0gdGFyZ2V0IGFzIEVsZW1lbnQ7XG4gICAgICBpZiAoY2xpY2tlZEVsZW1lbnQuY2xvc2VzdCgnW2RhdGEtZmxvYXRpbmc9XCJvdmVybGF5XCJdJykpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgICAgfVxuXG4gICAgICAvLyBDaGVjayBpZiB0aGUgY2xpY2tlZCBlbGVtZW50IGlzIHdpdGhpbiBhbm90aGVyIFBvcG92ZXIgb3IgUG9wb3ZlckNvbnRhaW5lclxuICAgICAgY29uc3QgaXNGbG9hdGluZ0VsZW1lbnQgPSBjbGlja2VkRWxlbWVudC5jbG9zZXN0KFxuICAgICAgICAnW2RhdGEtZmxvYXRpbmc9XCJwb3BvdmVyXCJdJ1xuICAgICAgKTtcbiAgICAgIGlmIChcbiAgICAgICAgaXNGbG9hdGluZ0VsZW1lbnQgJiZcbiAgICAgICAgIXBvcG92ZXJSZWYuY3VycmVudD8uY29udGFpbnMoaXNGbG9hdGluZ0VsZW1lbnQpXG4gICAgICApIHtcbiAgICAgICAgb25SZXF1ZXN0Q2xvc2U/LigpO1xuICAgICAgICByZXR1cm47XG4gICAgICB9XG5cbiAgICAgIG9uUmVxdWVzdENsb3NlPy4oKTtcbiAgICB9LFxuICAgIFtvblJlcXVlc3RDbG9zZSwgdGFyZ2V0UmVmLCBpc09wZW5dXG4gICk7XG5cbiAgLy8gQmFja3VwIGdsb2JhbCBjbGljayBsaXN0ZW5lciBmb3Igd2hlbiBhIFBvcG92ZXIgb3IgUG9wb3ZlckNvbnRhaW5lciBpcyBvcGVuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGlzT3Blbikge1xuICAgICAgLy8gVXNlIGEgc21hbGwgZGVsYXkgdG8gZW5zdXJlIHRoaXMgZG9lc24ndCBpbnRlcmZlcmUgd2l0aCB0aGUgRm9jdXNUcmFwJ3Mgb3duIGRldGVjdGlvblxuICAgICAgY29uc3QgdGltZW91dElkID0gc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgIGRvY3VtZW50LmFkZEV2ZW50TGlzdGVuZXIoJ21vdXNlZG93bicsIGhhbmRsZUdsb2JhbENsaWNrT3V0c2lkZSwgdHJ1ZSk7XG4gICAgICB9LCA1MCk7XG5cbiAgICAgIHJldHVybiAoKSA9PiB7XG4gICAgICAgIGNsZWFyVGltZW91dCh0aW1lb3V0SWQpO1xuICAgICAgICBkb2N1bWVudC5yZW1vdmVFdmVudExpc3RlbmVyKFxuICAgICAgICAgICdtb3VzZWRvd24nLFxuICAgICAgICAgIGhhbmRsZUdsb2JhbENsaWNrT3V0c2lkZSxcbiAgICAgICAgICB0cnVlXG4gICAgICAgICk7XG4gICAgICB9O1xuICAgIH1cbiAgfSwgW2lzT3BlbiwgaGFuZGxlR2xvYmFsQ2xpY2tPdXRzaWRlXSk7XG5cbiAgaWYgKCFpc09wZW4gfHwgIXRhcmdldFJlZi5jdXJyZW50KSByZXR1cm4gbnVsbDtcblxuICBjb25zdCB7XG4gICAgY2hpbGRyZW4sXG4gICAgc3R5bGU6IHJlc3RTdHlsZSxcbiAgICAuLi5yZXN0UHJvcHNcbiAgfSA9IHJlc3QgYXMgUmVhY3QuSFRNTEF0dHJpYnV0ZXM8SFRNTERpdkVsZW1lbnQ+O1xuXG4gIGNvbnN0IHsgZGlyTmV1dHJhbFN0eWxlcywgc3R5bGVzOiBwbGFjZW1lbnRTdHlsZXMgfSA9IHBvcG92ZXJQb3NpdGlvbjtcblxuICAvKipcbiAgICogTm9uLWVtcHR5IGBwbGFjZW1lbnRTdHlsZXNgIG1lcmdlZCBpbnRvIGlubGluZSBgc3R5bGVgXG4gICAqIGRpck5ldXRyYWxTdHlsZXNgIGxheWVyZWQgbGFzdCwgc2VlIHtAbGluayBnZXRQb3NpdGlvbn1cbiAgICovXG4gIGNvbnN0IHBsYWNlbWVudFN0eWxlc1RvTWVyZ2UgPVxuICAgIE9iamVjdC5rZXlzKHBsYWNlbWVudFN0eWxlcykubGVuZ3RoID4gMCA/IHBsYWNlbWVudFN0eWxlcyA6IG51bGw7XG5cbiAgY29uc3QgaGFzTWVyZ2VkU3R5bGUgPSBCb29sZWFuKFxuICAgIHJlc3RTdHlsZSB8fCBkaXJOZXV0cmFsU3R5bGVzIHx8IHBsYWNlbWVudFN0eWxlc1RvTWVyZ2VcbiAgKTtcbiAgY29uc3QgbWVyZ2VkU3R5bGUgPSBoYXNNZXJnZWRTdHlsZVxuICAgID8ge1xuICAgICAgICAuLi4odHlwZW9mIHJlc3RTdHlsZSA9PT0gJ29iamVjdCcgJiYgcmVzdFN0eWxlID8gcmVzdFN0eWxlIDoge30pLFxuICAgICAgICAuLi4ocGxhY2VtZW50U3R5bGVzVG9NZXJnZSA/PyB7fSksXG4gICAgICAgIC4uLmRpck5ldXRyYWxTdHlsZXMsXG4gICAgICB9XG4gICAgOiB1bmRlZmluZWQ7XG5cbiAgY29uc3QgY29udGVudCA9IChcbiAgICA8Rm9jdXNUcmFwXG4gICAgICBhbGxvd1BhZ2VJbnRlcmFjdGlvbj17aW5saW5lIHx8IGFsbG93UGFnZUludGVyYWN0aW9ufVxuICAgICAgZm9jdXNPblByb3BzPXtmb2N1c09uUHJvcHN9XG4gICAgICBvbkNsaWNrT3V0c2lkZT17aGFuZGxlQ2xpY2tPdXRzaWRlfVxuICAgICAgb25Fc2NhcGVLZXk9e29uUmVxdWVzdENsb3NlfVxuICAgID5cbiAgICAgIDxQb3BvdmVyQ29udGVudFxuICAgICAgICBkYXRhLWZsb2F0aW5nPVwicG9wb3ZlclwiXG4gICAgICAgIGRhdGEtdGVzdGlkPVwicG9wb3Zlci1jb250ZW50LWNvbnRhaW5lclwiXG4gICAgICAgIHBvc2l0aW9uPVwiYWJzb2x1dGVcIlxuICAgICAgICByZWY9e3BvcG92ZXJSZWZ9XG4gICAgICAgIC8qIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBnYW11dC9uby1pbmxpbmUtc3R5bGUgKi9cbiAgICAgICAgc3R5bGU9e21lcmdlZFN0eWxlfVxuICAgICAgICB0YWJJbmRleD17LTF9XG4gICAgICAgIHpJbmRleD17aW5saW5lID8gNSA6ICdpbml0aWFsJ31cbiAgICAgICAgey4uLnJlc3RQcm9wc31cbiAgICAgID5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgPC9Qb3BvdmVyQ29udGVudD5cbiAgICA8L0ZvY3VzVHJhcD5cbiAgKTtcblxuICBpZiAoaW5saW5lKSByZXR1cm4gY29udGVudDtcblxuICByZXR1cm4gPEJvZHlQb3J0YWw+e2NvbnRlbnR9PC9Cb2R5UG9ydGFsPjtcbn07XG4iXX0= */");
 export const PopoverContainer = ({
   alignment = 'bottom-left',
   offset = 20,
@@ -81,7 +81,7 @@ export const PopoverContainer = ({
     };
   }, [parent, x, y, offset, alignment, invertAxis, isRtl]);
   useEffect(() => {
-    const target = targetRef?.current;
+    const target = getRefElement(targetRef);
     if (!target) return;
     setContainers(getContainers(target, inline, {
       x: winX,
@@ -91,12 +91,12 @@ export const PopoverContainer = ({
 
   // Update target rectangle when window size/scroll changes
   useEffect(() => {
-    setTargetRect(targetRef?.current?.getBoundingClientRect());
+    setTargetRect(getRefElement(targetRef)?.getBoundingClientRect());
   }, [targetRef, isOpen, winW, winH, winX, winY]);
 
   // Update target rectangle when parent size/scroll changes
   const updateTargetPosition = useCallback(rect => {
-    const target = targetRef?.current;
+    const target = getRefElement(targetRef);
     if (!target) return;
     const newRect = rect || target.getBoundingClientRect();
     setTargetRect(newRect);
@@ -115,7 +115,7 @@ export const PopoverContainer = ({
     if (!closeOnViewportExit) return;
     const rect = targetRect || containers?.viewport;
     if (!rect) return;
-    const isOut = isOutOfView(rect, targetRef?.current, scrollingParents);
+    const isOut = isOutOfView(rect, getTargetAsElement(getRefElement(targetRef)) ?? undefined, scrollingParents);
     if (isOut && !hasRequestedCloseRef.current) {
       hasRequestedCloseRef.current = true;
       onRequestCloseRef.current?.();
@@ -129,7 +129,7 @@ export const PopoverContainer = ({
    */
   const handleClickOutside = useCallback(e => {
     const target = e.target;
-    const targetElement = targetRef.current;
+    const targetElement = getRefElement(targetRef);
     if (!targetElement) return;
     if (targetElement.contains(target)) return;
     if (popoverRef.current?.contains(target)) return;
@@ -144,7 +144,7 @@ export const PopoverContainer = ({
    */
   const handleGlobalClickOutside = useCallback(e => {
     const target = e.target;
-    const targetElement = targetRef.current;
+    const targetElement = getRefElement(targetRef);
     if (!targetElement || !isOpen) return;
     if (targetElement.contains(target) || popoverRef.current?.contains(target)) return;
 
@@ -176,7 +176,7 @@ export const PopoverContainer = ({
       };
     }
   }, [isOpen, handleGlobalClickOutside]);
-  if (!isOpen || !targetRef) return null;
+  if (!isOpen || !targetRef.current) return null;
   const {
     children,
     style: restStyle,

package/dist/PopoverContainer/hooks.d.ts

@@ -1,8 +1,20 @@
-export declare const useScrollingParentsEffect: (targetRef: React.RefObject<Pick<HTMLDivElement, "getBoundingClientRect" | "contains">>, setTargetRect: (rect: DOMRect | undefined) => void) => void;
-export declare const useResizingParentEffect: (targetRef: React.RefObject<Pick<HTMLDivElement, "getBoundingClientRect" | "contains">>, setTargetRect: (rect: DOMRect | undefined) => void) => void;
+import { type RefObject } from 'react';
+/**
+ * Minimal element shape required for popover positioning.
+ * Accepts both HTMLElement and TargetRef so Popover and PopoverContainer can share hooks.
+ */
+export interface PopoverTargetElement {
+    getBoundingClientRect(): DOMRect;
+    contains(other: Node | null): boolean;
+}
+/** Resolves ref object to current element; returns null when unset. */
+export declare function getRefElement(ref: RefObject<PopoverTargetElement | null>): PopoverTargetElement | null;
+/** Casts minimal target to HTMLElement for utils that need full DOM (e.g. parentElement). */
+export declare function getTargetAsElement(target: PopoverTargetElement | null): HTMLElement | null;
+export declare const useScrollingParentsEffect: (targetRef: RefObject<PopoverTargetElement | null>, setTargetRect: (rect: DOMRect | undefined) => void) => void;
+export declare const useResizingParentEffect: (targetRef: RefObject<PopoverTargetElement | null>, setTargetRect: (rect: DOMRect | undefined) => void) => void;
 /**
  * Memoizes the list of scrolling parent elements for a target element.
- * This avoids expensive DOM traversals and getComputedStyle calls on every render.
  * Returns an empty array if the target element is not available.
  */
-export declare const useScrollingParents: (targetRef: React.RefObject<HTMLElement | null>) => HTMLElement[];
+export declare const useScrollingParents: (targetRef: RefObject<PopoverTargetElement | null>) => HTMLElement[];

package/dist/PopoverContainer/hooks.js

@@ -1,18 +1,48 @@
-import { useEffect, useMemo } from 'react';
+import { useEffect, useLayoutEffect, useMemo, useState } from 'react';
+import { isNullish } from '../utils/nullish';
 import { findAllAdditionalScrollingParents, findResizingParent } from './utils';
+
+/**
+ * Minimal element shape required for popover positioning.
+ * Accepts both HTMLElement and TargetRef so Popover and PopoverContainer can share hooks.
+ */
+
+/** Resolves ref object to current element; returns null when unset. */
+export function getRefElement(ref) {
+  if (isNullish(ref)) return null;
+  return ref.current;
+}
+
+/** Casts minimal target to HTMLElement for utils that need full DOM (e.g. parentElement). */
+export function getTargetAsElement(target) {
+  return target;
+}
+
+/**
+ * Syncs ref.current to React state after each commit so hooks can depend on the
+ * resolved element when ref object identity is stable but .current updates.
+ */
+function useResolvedRefTarget(targetRef) {
+  const [resolved, setResolved] = useState(() => getRefElement(targetRef));
+
+  // ref.current updates do not change targetRef identity; run after every commit
+  // to sync. Functional setState bails out when the resolved node is unchanged.
+  // eslint-disable-next-line react-hooks/exhaustive-deps -- intentional post-commit ref sync
+  useLayoutEffect(() => {
+    const el = getRefElement(targetRef);
+    setResolved(prev => prev === el ? prev : el);
+  });
+  return resolved;
+}
 export const useScrollingParentsEffect = (targetRef, setTargetRect) => {
+  const resolvedTarget = useResolvedRefTarget(targetRef);
   useEffect(() => {
-    if (!targetRef.current) {
-      return;
-    }
-    const target = targetRef.current;
-    const scrollingParents = findAllAdditionalScrollingParents(target);
+    if (!resolvedTarget) return;
+    const scrollingParents = findAllAdditionalScrollingParents(getTargetAsElement(resolvedTarget));
     const updatePosition = () => {
-      setTargetRect(targetRef?.current?.getBoundingClientRect());
+      setTargetRect(resolvedTarget.getBoundingClientRect());
     };
     const cleanup = [];
-
-    // Add listeners to all scrolling parents (window scroll handled by useWindowScroll)
     scrollingParents.forEach(parent => {
       if (parent.addEventListener) {
         parent.addEventListener('scroll', updatePosition, {
@@ -24,38 +54,31 @@ export const useScrollingParentsEffect = (targetRef, setTargetRect) => {
     return () => {
       cleanup.forEach(fn => fn());
     };
-  }, [targetRef, setTargetRect]);
+  }, [resolvedTarget, setTargetRect]);
 };
 export const useResizingParentEffect = (targetRef, setTargetRect) => {
+  const resolvedTarget = useResolvedRefTarget(targetRef);
   useEffect(() => {
-    // handles movement of target within a clipped container e.g. Drawer
-    if (!targetRef.current || typeof ResizeObserver === 'undefined') {
-      return;
-    }
-    const resizingParent = findResizingParent(targetRef.current);
-    if (!resizingParent?.addEventListener) {
-      return;
-    }
+    if (!resolvedTarget || typeof ResizeObserver === 'undefined') return;
+    const resizingParent = findResizingParent(getTargetAsElement(resolvedTarget));
+    if (!resizingParent?.addEventListener) return;
     const handler = () => {
-      setTargetRect(targetRef?.current?.getBoundingClientRect());
+      setTargetRect(resolvedTarget.getBoundingClientRect());
     };
     const ro = new ResizeObserver(handler);
     ro.observe(resizingParent);
     return () => ro.unobserve(resizingParent);
-  }, [targetRef, setTargetRect]);
+  }, [resolvedTarget, setTargetRect]);
 };
 
 /**
  * Memoizes the list of scrolling parent elements for a target element.
- * This avoids expensive DOM traversals and getComputedStyle calls on every render.
  * Returns an empty array if the target element is not available.
  */
 export const useScrollingParents = targetRef => {
+  const resolvedTarget = useResolvedRefTarget(targetRef);
   return useMemo(() => {
-    if (!targetRef.current) {
-      return [];
-    }
-    return findAllAdditionalScrollingParents(targetRef.current);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [targetRef.current]);
+    if (!resolvedTarget) return [];
+    return findAllAdditionalScrollingParents(getTargetAsElement(resolvedTarget));
+  }, [resolvedTarget]);
 };

package/dist/PopoverContainer/types.d.ts

@@ -54,8 +54,9 @@ export interface PopoverContainerProps extends PopoverAlignment, WithChildrenPro
     onRequestClose?: () => void;
     /**
      * The target element around which the popover will be positioned.
+     * Only ref objects (e.g. from useRef) are supported at runtime; RefCallback is not.
      */
-    targetRef: RefObject<TargetRef>;
+    targetRef: RefObject<TargetRef | null>;
     /**
      * If true, it will allow outside page interaction. Popover container will still close when clicking outside of the popover or hitting the escape key.
      */