@servicetitan/anvil2 2.6.1 → 2.7.1

package/dist/{Popover-Br6qPgKe.js → Popover-Rha0q-Pv.js}

@@ -393,250 +393,283 @@ function PopoverTrigger(props) {
 }
 PopoverTrigger.displayName = "PopoverTrigger";
 
-const PopoverElement = forwardRef((props, ref) => {
-  const {
-    children,
-    openOnHover = false,
-    delay = 100,
-    placement = "bottom",
-    minHeight = "2.875rem",
-    open,
-    defaultOpen = false,
-    disableShift,
-    disableFlip,
-    disableFlipFallback,
-    matchReferenceWidth,
-    id,
-    disableCaret,
-    fixedWidth,
-    fillAvailableHeight,
-    maxHeight,
-    disableCloseOnClickOutside,
-    disableCloseOnEscape,
-    fitScreen,
-    disableTriggerFocus,
-    modal,
-    noPadding,
-    onClickOutside,
-    onClose,
-    onOpenAnimationStart,
-    onOpenAnimationComplete,
-    onCloseAnimationStart,
-    onCloseAnimationComplete
-  } = props;
-  const uid = useId();
-  const [invoker, setInvoker] = useState(void 0);
-  const [popover, setPopover] = useState(void 0);
-  const [rootNode, setRootNode] = useState();
-  const [arrowElement, setArrowElement] = useState(void 0);
-  const [openState, setOpenState] = useOptionallyControlledState({
-    controlledValue: open,
-    defaultValue: defaultOpen
-  });
-  const arrowRef = useRef(null);
-  const dialogContext = useContext(DialogContext);
-  const [triggerHovered, setTriggerHovered] = useState(false);
-  const [contentHovered, setContentHovered] = useState(false);
-  const [actualPlacement, setActualPlacement] = useState(
-    placement
-  );
-  const processMinHeight = typeof minHeight === "string" ? minHeight : `${minHeight}px`;
-  usePopoverTransitionStates(popover, openState, {
-    onOpenAnimationStart: useCallback(() => {
-      onOpenAnimationStart?.();
-    }, [onOpenAnimationStart]),
-    onOpenAnimationComplete: useCallback(() => {
-      onOpenAnimationComplete?.();
-    }, [onOpenAnimationComplete]),
-    onCloseAnimationStart: useCallback(() => {
-      onCloseAnimationStart?.();
-    }, [onCloseAnimationStart]),
-    onCloseAnimationComplete: useCallback(() => {
-      onCloseAnimationComplete?.();
-    }, [onCloseAnimationComplete])
-  });
-  const updatePosition = useCallback(() => {
-    if (!invoker || !popover) return;
-    if (!openState) return;
-    computePosition(invoker, popover, {
-      placement,
-      middleware: [
-        offset(8),
-        size({
-          padding: 5,
-          apply({ rects, availableHeight, elements }) {
-            Object.assign(elements.floating.style, {
-              ...matchReferenceWidth ? { width: `${rects.reference.width}px` } : fixedWidth ? { width: "40dvw" } : {},
-              ...fillAvailableHeight ? {
-                height: `${availableHeight - 20}px`,
-                minHeight: processMinHeight
-              } : {},
-              ...maxHeight ? {
-                minHeight: processMinHeight,
-                height: fitScreen ? typeof maxHeight === "string" ? maxHeight : `${maxHeight}px` : void 0,
-                maxHeight: fitScreen ? `${availableHeight - 20}px` : typeof maxHeight === "string" ? maxHeight : `${maxHeight}px`
-              } : {},
-              ...fitScreen && !maxHeight ? {
-                minHeight: processMinHeight,
-                maxHeight: `${availableHeight - 20}px`
-              } : {},
-              zIndex: 1
-            });
-          }
-        }),
-        flip({
-          mainAxis: !disableFlip,
-          crossAxis: false,
-          fallbackAxisSideDirection: disableFlipFallback ? "none" : "end",
-          padding: 5
-        }),
-        shift({
-          padding: 5,
-          mainAxis: !disableShift,
-          crossAxis: false,
-          limiter: limitShift({
-            mainAxis: !disableShift
-          })
-        }),
-        arrow$1({
-          element: !disableCaret && arrowElement ? arrowElement : null,
-          padding: 5
-        })
-      ]
-    }).then(({ x, y, placement: placement2, middlewareData }) => {
-      setActualPlacement(placement2);
-      const side = placement2.split("-")[0];
-      const staticSide = {
-        top: "bottom",
-        right: "left",
-        bottom: "top",
-        left: "right"
-      }[side];
-      const arrowDeg = () => {
-        if (staticSide === "top") return 180;
-        if (staticSide === "bottom") return 0;
-        if (staticSide === "left") return 90;
-        return 270;
-      };
-      Object.assign(popover.style, {
-        left: `${x}px`,
-        top: `${y}px`
-      });
-      if (middlewareData.arrow && arrowElement) {
-        const { x: x2, y: y2 } = middlewareData.arrow;
-        Object.assign(arrowElement.style, {
-          left: x2 != null ? `${x2}px` : "",
-          top: y2 != null ? `${y2}px` : "",
-          right: "",
-          bottom: "",
-          [staticSide]: `${-arrowElement.offsetWidth + 2}px`,
-          transform: `rotate(${arrowDeg()}deg)`
-        });
-      }
+const Popover = Object.assign(
+  forwardRef(function PopoverInner(props, ref) {
+    const {
+      children,
+      openOnHover = false,
+      delay = 100,
+      placement = "bottom",
+      minHeight = "2.875rem",
+      open,
+      defaultOpen = false,
+      disableShift,
+      disableFlip,
+      disableFlipFallback,
+      matchReferenceWidth,
+      id,
+      disableCaret,
+      fixedWidth,
+      fillAvailableHeight,
+      maxHeight,
+      disableCloseOnClickOutside,
+      disableCloseOnEscape,
+      fitScreen,
+      disableTriggerFocus,
+      modal,
+      noPadding,
+      onClickOutside,
+      onClose,
+      onOpenAnimationStart,
+      onOpenAnimationComplete,
+      onCloseAnimationStart,
+      onCloseAnimationComplete
+    } = props;
+    const uid = useId();
+    const [invoker, setInvoker] = useState(void 0);
+    const [popover, setPopover] = useState(void 0);
+    const [rootNode, setRootNode] = useState();
+    const [arrowElement, setArrowElement] = useState(void 0);
+    const [openState, setOpenState] = useOptionallyControlledState({
+      controlledValue: open,
+      defaultValue: defaultOpen
     });
-  }, [
-    arrowElement,
-    disableCaret,
-    disableFlip,
-    disableFlipFallback,
-    disableShift,
-    fillAvailableHeight,
-    fitScreen,
-    fixedWidth,
-    invoker,
-    matchReferenceWidth,
-    maxHeight,
-    openState,
-    placement,
-    popover,
-    processMinHeight
-  ]);
-  useLayoutEffect(() => {
-    if (!popover || !invoker) return;
-    if (!openState) {
-      return;
-    }
-    let requestID = null;
-    const cleanup = autoUpdate(invoker, popover, () => {
-      requestID = requestAnimationFrame(updatePosition);
+    const arrowRef = useRef(null);
+    const dialogContext = useContext(DialogContext);
+    const [triggerHovered, setTriggerHovered] = useState(false);
+    const [contentHovered, setContentHovered] = useState(false);
+    const [actualPlacement, setActualPlacement] = useState(placement);
+    const processMinHeight = typeof minHeight === "string" ? minHeight : `${minHeight}px`;
+    usePopoverTransitionStates(popover, openState, {
+      onOpenAnimationStart: useCallback(() => {
+        onOpenAnimationStart?.();
+      }, [onOpenAnimationStart]),
+      onOpenAnimationComplete: useCallback(() => {
+        onOpenAnimationComplete?.();
+      }, [onOpenAnimationComplete]),
+      onCloseAnimationStart: useCallback(() => {
+        onCloseAnimationStart?.();
+      }, [onCloseAnimationStart]),
+      onCloseAnimationComplete: useCallback(() => {
+        onCloseAnimationComplete?.();
+      }, [onCloseAnimationComplete])
     });
-    return () => {
-      if (requestID) cancelAnimationFrame(requestID);
-      cleanup();
-    };
-  }, [invoker, popover, updatePosition, openState]);
-  popover?.getRootNode();
-  const popoverId = id ?? `popover-${uid.replace(/:/g, "")}`;
-  const isControlled = typeof open !== "undefined";
-  const openPopover = useCallback(() => {
-    if (!popover || !rootNode?.querySelector(`#${popoverId}`))
-      return;
-    setOpenState(true);
-  }, [popover, rootNode, popoverId, setOpenState]);
-  const closePopover = useCallback(
-    (fn) => {
-      if (!popover || !openState) return;
-      if (!openOnHover) onClose?.();
-      setOpenState(false);
-      setTriggerHovered(false);
-      setContentHovered(false);
-      fn?.();
-    },
-    [
-      popover,
-      openState,
-      openOnHover,
-      onClose,
-      setOpenState,
-      setTriggerHovered,
-      setContentHovered
-    ]
-  );
-  useImperativeHandle(
-    ref,
-    () => ({
-      openPopover,
-      closePopover
-    }),
-    [openPopover, closePopover]
-  );
-  useEffect(() => {
-    if (typeof openState === "undefined") return;
-    if (openState) {
-      if (dialogContext) {
-        if (dialogContext?.ref?.current?.open) {
-          safeShowPopover(popover);
-          dialogContext?.setHasOpenPopover?.(true);
+    const updatePosition = useCallback(() => {
+      if (!invoker || !popover) return;
+      if (!openState) return;
+      computePosition(invoker, popover, {
+        placement,
+        middleware: [
+          offset(8),
+          size({
+            padding: 5,
+            apply({ rects, availableHeight, elements }) {
+              Object.assign(elements.floating.style, {
+                ...matchReferenceWidth ? { width: `${rects.reference.width}px` } : fixedWidth ? { width: "40dvw" } : {},
+                ...fillAvailableHeight ? {
+                  height: `${availableHeight - 20}px`,
+                  minHeight: processMinHeight
+                } : {},
+                ...maxHeight ? {
+                  minHeight: processMinHeight,
+                  height: fitScreen ? typeof maxHeight === "string" ? maxHeight : `${maxHeight}px` : void 0,
+                  maxHeight: fitScreen ? `${availableHeight - 20}px` : typeof maxHeight === "string" ? maxHeight : `${maxHeight}px`
+                } : {},
+                ...fitScreen && !maxHeight ? {
+                  minHeight: processMinHeight,
+                  maxHeight: `${availableHeight - 20}px`
+                } : {},
+                zIndex: 1
+              });
+            }
+          }),
+          flip({
+            mainAxis: !disableFlip,
+            crossAxis: false,
+            fallbackAxisSideDirection: disableFlipFallback ? "none" : "end",
+            padding: 5
+          }),
+          shift({
+            padding: 5,
+            mainAxis: !disableShift,
+            crossAxis: false,
+            limiter: limitShift({
+              mainAxis: !disableShift
+            })
+          }),
+          arrow$1({
+            element: !disableCaret && arrowElement ? arrowElement : null,
+            padding: 5
+          })
+        ]
+      }).then(({ x, y, placement: placement2, middlewareData }) => {
+        setActualPlacement(placement2);
+        const side = placement2.split("-")[0];
+        const staticSide = {
+          top: "bottom",
+          right: "left",
+          bottom: "top",
+          left: "right"
+        }[side];
+        const arrowDeg = () => {
+          if (staticSide === "top") return 180;
+          if (staticSide === "bottom") return 0;
+          if (staticSide === "left") return 90;
+          return 270;
+        };
+        Object.assign(popover.style, {
+          left: `${x}px`,
+          top: `${y}px`
+        });
+        if (middlewareData.arrow && arrowElement) {
+          const { x: x2, y: y2 } = middlewareData.arrow;
+          Object.assign(arrowElement.style, {
+            left: x2 != null ? `${x2}px` : "",
+            top: y2 != null ? `${y2}px` : "",
+            right: "",
+            bottom: "",
+            [staticSide]: `${-arrowElement.offsetWidth + 2}px`,
+            transform: `rotate(${arrowDeg()}deg)`
+          });
         }
+      });
+    }, [
+      arrowElement,
+      disableCaret,
+      disableFlip,
+      disableFlipFallback,
+      disableShift,
+      fillAvailableHeight,
+      fitScreen,
+      fixedWidth,
+      invoker,
+      matchReferenceWidth,
+      maxHeight,
+      openState,
+      placement,
+      popover,
+      processMinHeight
+    ]);
+    useLayoutEffect(() => {
+      if (!popover || !invoker) return;
+      if (!openState) {
         return;
       }
-      safeShowPopover(popover);
-    } else {
-      safeHidePopover(popover);
-      dialogContext?.setHasOpenPopover?.(false);
-    }
-  }, [openState, openPopover, closePopover, dialogContext, popover]);
-  useOnClickOutside({
-    disable: disableCloseOnClickOutside || !openState,
-    onClickOutsideBegin: (e) => {
-      if (!openState) return;
-      onClickOutside?.(e);
-    },
-    targets: [invoker, popover],
-    onClickOutside: () => {
-      if (openOnHover || isControlled) return;
-      closePopover();
-    }
-  });
-  const value = useMemo(() => {
-    return {
+      let requestID = null;
+      const cleanup = autoUpdate(invoker, popover, () => {
+        requestID = requestAnimationFrame(updatePosition);
+      });
+      return () => {
+        if (requestID) cancelAnimationFrame(requestID);
+        cleanup();
+      };
+    }, [invoker, popover, updatePosition, openState]);
+    popover?.getRootNode();
+    const popoverId = id ?? `popover-${uid.replace(/:/g, "")}`;
+    const isControlled = typeof open !== "undefined";
+    const openPopover = useCallback(() => {
+      if (!popover || !rootNode?.querySelector(`#${popoverId}`))
+        return;
+      setOpenState(true);
+    }, [popover, rootNode, popoverId, setOpenState]);
+    const closePopover = useCallback(
+      (fn) => {
+        if (!popover || !openState) return;
+        if (!openOnHover) onClose?.();
+        setOpenState(false);
+        setTriggerHovered(false);
+        setContentHovered(false);
+        fn?.();
+      },
+      [
+        popover,
+        openState,
+        openOnHover,
+        onClose,
+        setOpenState,
+        setTriggerHovered,
+        setContentHovered
+      ]
+    );
+    useImperativeHandle(
+      ref,
+      () => ({
+        openPopover,
+        closePopover
+      }),
+      [openPopover, closePopover]
+    );
+    useEffect(() => {
+      if (typeof openState === "undefined") return;
+      if (openState) {
+        if (dialogContext) {
+          if (dialogContext?.ref?.current?.open) {
+            safeShowPopover(popover);
+            dialogContext?.setHasOpenPopover?.(true);
+          }
+          return;
+        }
+        safeShowPopover(popover);
+      } else {
+        safeHidePopover(popover);
+        dialogContext?.setHasOpenPopover?.(false);
+      }
+    }, [openState, openPopover, closePopover, dialogContext, popover]);
+    useOnClickOutside({
+      disable: disableCloseOnClickOutside || !openState,
+      onClickOutsideBegin: (e) => {
+        if (!openState) return;
+        onClickOutside?.(e);
+      },
+      targets: [invoker, popover],
+      onClickOutside: () => {
+        if (openOnHover || isControlled) return;
+        closePopover();
+      }
+    });
+    const value = useMemo(() => {
+      return {
+        popoverId,
+        invoker,
+        setInvoker,
+        popover,
+        setPopover,
+        arrowElement,
+        setArrowElement,
+        openPopover,
+        closePopover,
+        placement,
+        actualPlacement,
+        onClose,
+        openOnHover,
+        openState,
+        setOpenState,
+        disableCloseOnClickOutside,
+        fillAvailableHeight,
+        maxHeight,
+        matchReferenceWidth,
+        fixedWidth,
+        disableCaret,
+        disableFlipFallback,
+        disableTriggerFocus,
+        disableCloseOnEscape,
+        noPadding,
+        controlled: isControlled,
+        modal,
+        arrowRef,
+        rootNode,
+        setRootNode,
+        delay,
+        triggerHovered,
+        setTriggerHovered,
+        contentHovered,
+        setContentHovered
+      };
+    }, [
       popoverId,
       invoker,
-      setInvoker,
       popover,
-      setPopover,
       arrowElement,
-      setArrowElement,
       openPopover,
       closePopover,
       placement,
@@ -655,130 +688,97 @@ const PopoverElement = forwardRef((props, ref) => {
       disableTriggerFocus,
       disableCloseOnEscape,
       noPadding,
-      controlled: isControlled,
+      isControlled,
       modal,
-      arrowRef,
       rootNode,
-      setRootNode,
       delay,
       triggerHovered,
       setTriggerHovered,
       contentHovered,
       setContentHovered
-    };
-  }, [
-    popoverId,
-    invoker,
-    popover,
-    arrowElement,
-    openPopover,
-    closePopover,
-    placement,
-    actualPlacement,
-    onClose,
-    openOnHover,
-    openState,
-    setOpenState,
-    disableCloseOnClickOutside,
-    fillAvailableHeight,
-    maxHeight,
-    matchReferenceWidth,
-    fixedWidth,
-    disableCaret,
-    disableFlipFallback,
-    disableTriggerFocus,
-    disableCloseOnEscape,
-    noPadding,
-    isControlled,
-    modal,
-    rootNode,
-    delay,
-    triggerHovered,
-    setTriggerHovered,
-    contentHovered,
-    setContentHovered
-  ]);
-  return /* @__PURE__ */ jsx(PopoverContext.Provider, { value, children });
-});
-PopoverElement.displayName = "Popover";
-const Popover = Object.assign(PopoverElement, {
-  /**
-   * PopoverTrigger component for creating custom trigger elements.
-   *
-   * Features:
-   * - Supports custom trigger elements via render prop pattern
-   * - Automatic focus management and keyboard interaction
-   * - Hover and click event handling
-   * - Accessibility attributes (aria-haspopup, aria-expanded, aria-details)
-   * - Context integration with parent popover
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Popover.Trigger>
-   *   {(props) => (
-   *     <button {...props}>
-   *       Click to open popover
-   *     </button>
-   *   )}
-   * </Popover.Trigger>
-   */
-  Trigger: PopoverTrigger,
-  /**
-   * PopoverContent component for the main popover content area.
-   *
-   * Features:
-   * - Automatic positioning and sizing based on trigger
-   * - Screen boundary detection and fitting
-   * - Scroll handling with custom scroller reference
-   * - Focus management and keyboard navigation
-   * - Hover interaction support for tooltip mode
-   * - Escape key handling for closing
-   * - Tab key trapping for modal popovers
-   * - Arrow/caret indicator with automatic positioning
-   * - Context integration with parent popover
-   * - Accessibility support with proper ARIA roles
-   *
-   * @example
-   * <Popover.Content>
-   *   <p>This is the popover content</p>
-   *   <Popover.Close>Close</Popover.Close>
-   * </Popover.Content>
-   */
-  Content: PopoverContent,
-  /**
-   * PopoverClose component for closing the popover.
-   *
-   * Features:
-   * - Automatic popover closing on click
-   * - Supports all Button component props and styling
-   * - Controlled and uncontrolled mode support
-   * - Context integration with parent popover
-   * - Accessibility support with proper button semantics
-   * - Delayed closing for controlled mode
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Popover.Close>Close</Popover.Close>
-   */
-  Close: PopoverClose,
-  /**
-   * PopoverButton component for creating button-style triggers.
-   *
-   * Features:
-   * - Button styling and behavior with all Button props
-   * - Automatic popover opening on click
-   * - Hover interaction support for tooltip mode
-   * - Focus management and keyboard navigation
-   * - Accessibility attributes (aria-haspopup, aria-expanded, aria-details)
-   * - Context integration with parent popover
-   * - Event handling for mouse, keyboard, and focus events
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Popover.Button>Click to open</Popover.Button>
-   */
-  Button: PopoverButton
-});
+    ]);
+    return /* @__PURE__ */ jsx(PopoverContext.Provider, { value, children });
+  }),
+  {
+    /**
+     * PopoverTrigger component for creating custom trigger elements.
+     *
+     * Features:
+     * - Supports custom trigger elements via render prop pattern
+     * - Automatic focus management and keyboard interaction
+     * - Hover and click event handling
+     * - Accessibility attributes (aria-haspopup, aria-expanded, aria-details)
+     * - Context integration with parent popover
+     * - Automatic tracking ID generation for analytics
+     *
+     * @example
+     * <Popover.Trigger>
+     *   {(props) => (
+     *     <button {...props}>
+     *       Click to open popover
+     *     </button>
+     *   )}
+     * </Popover.Trigger>
+     */
+    Trigger: PopoverTrigger,
+    /**
+     * PopoverContent component for the main popover content area.
+     *
+     * Features:
+     * - Automatic positioning and sizing based on trigger
+     * - Screen boundary detection and fitting
+     * - Scroll handling with custom scroller reference
+     * - Focus management and keyboard navigation
+     * - Hover interaction support for tooltip mode
+     * - Escape key handling for closing
+     * - Tab key trapping for modal popovers
+     * - Arrow/caret indicator with automatic positioning
+     * - Context integration with parent popover
+     * - Accessibility support with proper ARIA roles
+     *
+     * @example
+     * <Popover.Content>
+     *   <p>This is the popover content</p>
+     *   <Popover.Close>Close</Popover.Close>
+     * </Popover.Content>
+     */
+    Content: PopoverContent,
+    /**
+     * PopoverClose component for closing the popover.
+     *
+     * Features:
+     * - Automatic popover closing on click
+     * - Supports all Button component props and styling
+     * - Controlled and uncontrolled mode support
+     * - Context integration with parent popover
+     * - Accessibility support with proper button semantics
+     * - Delayed closing for controlled mode
+     * - Automatic tracking ID generation for analytics
+     *
+     * @example
+     * <Popover.Close>Close</Popover.Close>
+     */
+    Close: PopoverClose,
+    /**
+     * PopoverButton component for creating button-style triggers.
+     *
+     * Features:
+     * - Button styling and behavior with all Button props
+     * - Automatic popover opening on click
+     * - Hover interaction support for tooltip mode
+     * - Focus management and keyboard navigation
+     * - Accessibility attributes (aria-haspopup, aria-expanded, aria-details)
+     * - Context integration with parent popover
+     * - Event handling for mouse, keyboard, and focus events
+     * - Automatic tracking ID generation for analytics
+     *
+     * @example
+     * <Popover.Button>Click to open</Popover.Button>
+     */
+    Button: PopoverButton
+  }
+);
+Popover.displayName = "Popover";
 
 export { Popover as P, usePopoverContext as u };
-//# sourceMappingURL=Popover-Br6qPgKe.js.map
+//# sourceMappingURL=Popover-Rha0q-Pv.js.map