@servicetitan/anvil2 1.44.2 → 1.45.0

package/dist/{Popover-CU2cGVD8-Casl3vM1.js → Popover-r26xMIfm.js}

@@ -1,14 +1,148 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { forwardRef, useRef, useContext, createContext, useMemo, useState, useLayoutEffect, useId, useCallback, useEffect } from 'react';
-import { i as DialogContext, p as DrawerContext, s as supportsPopover, u as useKeyboardFocusables, q as safeShowPopover, r as safeHidePopover, l as useOnClickOutside, v as useOpenCloseTransitionStates } from './ProgressBar-BRvB-bD4-DppwBrFg.js';
-import { B as Button } from './Button-BaHFf1AT-BQy-PFB5.js';
-import { F as FloatingPortal, a as FloatingFocusManager, b as FloatingArrow, c as useFloating, o as offset, s as size, f as flip, d as shift, e as arrow$1, l as limitShift, g as useClick, h as useHover, i as safePolygon, j as useDismiss, k as useRole, m as useInteractions, n as autoUpdate, p as computePosition } from './floating-ui.react-BFNinq1w.js';
-import { u as useMergeRefs } from './useMergeRefs-Bde85AWI-Bde85AWI.js';
+import { createContext, useContext, useRef, useLayoutEffect, useState, useMemo, forwardRef, useId, useCallback, useEffect } from 'react';
+import { B as Button } from './Button-BxFXQ0-n.js';
+import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
+import { useTrackingId } from './useTrackingId.js';
+import { f as useFloating, o as offset, i as size, g as flip, h as shift, J as arrow$1, l as limitShift, m as useClick, j as useHover, k as safePolygon, p as useDismiss, n as useRole, v as useInteractions, A as autoUpdate, D as DialogContext, a as DrawerContext, y as FloatingPortal, z as FloatingFocusManager, H as FloatingArrow, s as supportsPopover, B as computePosition, C as safeShowPopover, E as safeHidePopover } from './DrawerContext-DboTgTmo.js';
+import { u as useMergeRefs } from './useMergeRefs-Bde85AWI.js';
 import { c as cx } from './index-tZvMCc77.js';
-import { a as PortalProviderContext } from './PortalProvider-9lXkQ0xY-BKoGegS1.js';
-import { T as ThemeProvider, a as ThemeProviderContext } from './ThemeProvider-Q3ji6Rpx-DBXlAuQ8.js';
+import { P as PortalProviderContext } from './PortalProvider-9lXkQ0xY.js';
+import { T as ThemeProvider } from './ThemeProvider-Be3Pvtpz.js';
+import { T as ThemeProviderContext } from './ThemeProviderContext-l52GohYT.js';
+import { u as useOpenCloseTransitionStates, a as useKeyboardFocusables, b as useOnClickOutside } from './useOnClickOutside-BHEWMLa9.js';
 
-import './Popover-CU2cGVD8.css';function usePopoverLegacy({
+import './Popover.css';const usePopoverTransitionStates = (popover, openProp, options = {}) => {
+  const { onOpenAnimationStart, onCloseAnimationComplete } = options;
+  return useOpenCloseTransitionStates(openProp, {
+    ...options,
+    onOpenAnimationStart: () => {
+      if (!popover) return;
+      onOpenAnimationStart?.();
+    },
+    onCloseAnimationComplete: () => {
+      if (!popover) return;
+      onCloseAnimationComplete?.();
+    },
+    durationMs: () => {
+      if (!popover) return 0;
+      const duration = window.getComputedStyle(popover).animationDuration;
+      return parseFloat(duration) * 1e3;
+    }
+  });
+};
+
+const PopoverContext = createContext(null);
+
+function usePopoverContext() {
+  const context = useContext(PopoverContext);
+  const invokerRef = useRef(null);
+  const popoverRef = useRef(null);
+  const arrowRef = useRef(null);
+  useLayoutEffect(() => {
+    if (!invokerRef.current) return;
+    context?.setInvoker?.(invokerRef.current);
+  }, [context, invokerRef]);
+  useLayoutEffect(() => {
+    if (!popoverRef.current) return;
+    context?.setPopover?.(popoverRef.current);
+    context?.setRootNode?.(popoverRef.current.getRootNode());
+    if (!arrowRef.current) return;
+    context?.setArrowElement?.(arrowRef.current);
+  }, [context, popoverRef]);
+  const onMouseEnterHandler = () => {
+    if (!context?.openOnHover) return;
+    context.openPopover();
+  };
+  const onMouseLeaveHandler = () => {
+    if (!context?.openOnHover) return;
+    context.closePopover();
+  };
+  const onFocusHandler = () => {
+    if (context?.controlled || !context?.openOnHover) return;
+    context?.openPopover();
+  };
+  const onBlurHandler = () => {
+    if (context?.controlled || context?.disableCloseOnClickOutside || !context?.openOnHover)
+      return;
+    context?.closePopover();
+  };
+  const onKeyDownHandler = (e) => {
+    if (!context?.openState) return;
+    if (e.code === "Escape" && !context?.disableCloseOnEscape && !context?.controlled) {
+      context?.closePopover();
+      return;
+    }
+    const focusables = context.focusables;
+    if (e.code === "Tab" && e.shiftKey && context?.modal && focusables) {
+      focusables[focusables.length - 1].focus();
+      e.preventDefault();
+      return;
+    }
+  };
+  const onClickHandler = () => {
+    context?.invoker?.focus();
+    if (context?.openOnHover) return;
+    if (context?.controlled === false) {
+      if (context?.openState) {
+        context?.closePopover();
+      } else {
+        context?.openPopover();
+      }
+      return;
+    }
+  };
+  if (!context || !invokerRef || !popoverRef) return;
+  return {
+    invoker: {
+      ref: invokerRef,
+      element: context.invoker,
+      onMouseEnter: onMouseEnterHandler,
+      onMouseLeave: onMouseLeaveHandler,
+      onKeyDown: onKeyDownHandler,
+      onClick: onClickHandler,
+      onFocus: onFocusHandler,
+      onBlur: onBlurHandler,
+      "aria-haspopup": true,
+      "aria-expanded": context.openState,
+      "aria-details": context.popoverId,
+      "data-state": context.openState ? "open" : "closed"
+    },
+    popover: {
+      ref: popoverRef,
+      element: context.popover,
+      id: context.popoverId,
+      onClose: context.onClose,
+      show: context.openPopover,
+      close: context.closePopover,
+      noPadding: context.noPadding,
+      style: context.popoverStyle,
+      arrowRef,
+      key: context.resetKey
+    },
+    rootNode: context.rootNode,
+    onClose: context.onClose,
+    setOpen: context.setOpenState,
+    open: context.openState,
+    openOnHover: context.openOnHover,
+    controlled: context.controlled,
+    disableCloseOnClickOutside: context.disableCloseOnClickOutside,
+    disableCloseOnEscape: context.disableCloseOnEscape,
+    modal: context.modal,
+    placement: context.placement,
+    disableCaret: context.disableCaret,
+    noPadding: context.noPadding,
+    fillAvailableHeight: context.fillAvailableHeight,
+    maxHeight: context.maxHeight,
+    matchReferenceWidth: context.matchReferenceWidth,
+    fixedWidth: context.fixedWidth,
+    disableFlipFallback: context.disableFlipFallback,
+    disableFocusLock: context.modal,
+    disableTriggerFocus: context.disableTriggerFocus,
+    focusables: context.focusables
+  };
+}
+
+function usePopoverLegacy({
   defaultOpen,
   placement = "bottom",
   modal,
@@ -315,162 +449,42 @@ const PopoverLegacy = Object.assign(PopoverLegacyElement, {
   Button: PopoverLegacyButton
 });
 
-function compareElements(el1, el2, excludeAttributes = []) {
-  if (!el1 || !el2 || el1.tagName !== el2.tagName) {
-    return false;
-  }
-  const getFilteredAttributes = (attrs) => {
-    const filtered = {};
-    for (let i = 0; i < attrs.length; i++) {
-      const attr = attrs[i];
-      if (!excludeAttributes.includes(attr.name)) {
-        filtered[attr.name] = attr.value;
+const PopoverClose = forwardRef(
+  function PopoverClose2(props, ref) {
+    const { onClick, ...rest } = props;
+    const context = usePopoverContext();
+    const data = {
+      children: childrenToString(props.children)
+    };
+    const trackingId = useTrackingId({
+      name: "PopoverClose",
+      data,
+      hasOverride: !!props["data-tracking-id"]
+    });
+    if (!supportsPopover())
+      return /* @__PURE__ */ jsx(PopoverLegacyClose, { ...props, ref });
+    return /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref,
+        "data-tracking-id": trackingId,
+        "data-anv": "popover-close",
+        ...rest,
+        onClick: (event) => {
+          onClick?.(event);
+          if (context?.controlled) {
+            setTimeout(() => {
+              context?.onClose?.();
+            }, 100);
+            return;
+          }
+          context?.popover.close();
+        }
       }
-    }
-    return filtered;
-  };
-  const filteredAttrs1 = getFilteredAttributes(el1.attributes);
-  const filteredAttrs2 = getFilteredAttributes(el2.attributes);
-  const keys1 = Object.keys(filteredAttrs1);
-  const keys2 = Object.keys(filteredAttrs2);
-  if (keys1.length !== keys2.length) return false;
-  for (const key of keys1) {
-    if (filteredAttrs1[key] !== filteredAttrs2[key]) {
-      return false;
-    }
-  }
-  const isOnlyText1 = el1.childNodes.length === 1 && el1.childNodes[0].nodeType === Node.TEXT_NODE;
-  const isOnlyText2 = el2.childNodes.length === 1 && el2.childNodes[0].nodeType === Node.TEXT_NODE;
-  if (isOnlyText1 && isOnlyText2) {
-    if (el1.textContent?.trim() !== el2.textContent?.trim()) {
-      return false;
-    }
-  }
-  const children1 = el1.children;
-  const children2 = el2.children;
-  if (children1.length !== children2.length) return false;
-  for (let i = 0; i < children1.length; i++) {
-    if (!compareElements(
-      children1[i],
-      children2[i],
-      excludeAttributes
-    )) {
-      return false;
-    }
+    );
   }
-  return true;
-}
-
-const PopoverContext = createContext(null);
-
-function usePopoverContext() {
-  const context = useContext(PopoverContext);
-  const invokerRef = useRef(null);
-  const popoverRef = useRef(null);
-  const arrowRef = useRef(null);
-  useLayoutEffect(() => {
-    if (!invokerRef.current) return;
-    context?.setInvoker?.(invokerRef.current);
-  }, [context, invokerRef]);
-  useLayoutEffect(() => {
-    if (!popoverRef.current) return;
-    context?.setPopover?.(popoverRef.current);
-    context?.setRootNode?.(popoverRef.current.getRootNode());
-    if (!arrowRef.current) return;
-    context?.setArrowElement?.(arrowRef.current);
-  }, [context, popoverRef]);
-  const onMouseEnterHandler = () => {
-    if (!context?.openOnHover) return;
-    context.openPopover();
-  };
-  const onMouseLeaveHandler = () => {
-    if (!context?.openOnHover) return;
-    context.closePopover();
-  };
-  const onFocusHandler = () => {
-    if (context?.controlled || !context?.openOnHover) return;
-    context?.openPopover();
-  };
-  const onBlurHandler = () => {
-    if (context?.controlled || context?.disableCloseOnClickOutside || !context?.openOnHover)
-      return;
-    context?.closePopover();
-  };
-  const onKeyDownHandler = (e) => {
-    if (!context?.openState) return;
-    if (e.code === "Escape" && !context?.disableCloseOnEscape && !context?.controlled) {
-      context?.closePopover();
-      return;
-    }
-    const focusables = context.focusables;
-    if (e.code === "Tab" && e.shiftKey && context?.modal && focusables) {
-      focusables[focusables.length - 1].focus();
-      e.preventDefault();
-      return;
-    }
-  };
-  const onClickHandler = () => {
-    context?.invoker?.focus();
-    if (context?.openOnHover) return;
-    if (context?.controlled === false) {
-      if (context?.openState) {
-        context?.closePopover();
-      } else {
-        context?.openPopover();
-      }
-      return;
-    }
-  };
-  if (!context || !invokerRef || !popoverRef) return;
-  return {
-    invoker: {
-      ref: invokerRef,
-      element: context.invoker,
-      onMouseEnter: onMouseEnterHandler,
-      onMouseLeave: onMouseLeaveHandler,
-      onKeyDown: onKeyDownHandler,
-      onClick: onClickHandler,
-      onFocus: onFocusHandler,
-      onBlur: onBlurHandler,
-      "aria-haspopup": true,
-      "aria-expanded": context.openState,
-      "aria-details": context.popoverId,
-      "data-state": context.openState ? "open" : "closed"
-    },
-    popover: {
-      ref: popoverRef,
-      element: context.popover,
-      id: context.popoverId,
-      onClose: context.onClose,
-      show: context.openPopover,
-      close: context.closePopover,
-      noPadding: context.noPadding,
-      style: context.popoverStyle,
-      arrowRef,
-      key: context.resetKey
-    },
-    rootNode: context.rootNode,
-    onClose: context.onClose,
-    setOpen: context.setOpenState,
-    open: context.openState,
-    openOnHover: context.openOnHover,
-    controlled: context.controlled,
-    disableCloseOnClickOutside: context.disableCloseOnClickOutside,
-    disableCloseOnEscape: context.disableCloseOnEscape,
-    modal: context.modal,
-    placement: context.placement,
-    disableCaret: context.disableCaret,
-    noPadding: context.noPadding,
-    fillAvailableHeight: context.fillAvailableHeight,
-    maxHeight: context.maxHeight,
-    matchReferenceWidth: context.matchReferenceWidth,
-    fixedWidth: context.fixedWidth,
-    disableFlipFallback: context.disableFlipFallback,
-    disableFocusLock: context.modal,
-    disableTriggerFocus: context.disableTriggerFocus,
-    focusables: context.focusables
-  };
-}
+);
+PopoverClose.displayName = "PopoverClose";
 
 const PopoverButton = forwardRef(
   function PopoverButton2(props, ref) {
@@ -486,6 +500,18 @@ const PopoverButton = forwardRef(
       ...rest
     } = props;
     const context = usePopoverContext();
+    const data = {
+      children: childrenToString(props.children),
+      appearance: props.appearance,
+      icon: props.icon,
+      size: props.size,
+      type: props.type
+    };
+    const trackingId = useTrackingId({
+      name: "PopoverButton",
+      data,
+      hasOverride: !!props["data-tracking-id"]
+    });
     const onMouseEnterHandler = (e) => {
       onMouseEnter?.(e);
       context?.invoker.onMouseEnter();
@@ -531,6 +557,7 @@ const PopoverButton = forwardRef(
         onFocus: onFocusHandler,
         onBlur: onBlurHandler,
         "data-anv": "popover-button",
+        "data-tracking-id": trackingId,
         "aria-haspopup": context?.invoker["aria-haspopup"],
         "aria-expanded": context?.invoker["aria-expanded"],
         "aria-details": context?.invoker["aria-details"],
@@ -541,33 +568,7 @@ const PopoverButton = forwardRef(
     );
   }
 );
-
-const PopoverClose = forwardRef(
-  function PopoverClose2(props, ref) {
-    const { onClick, ...rest } = props;
-    const context = usePopoverContext();
-    if (!supportsPopover())
-      return /* @__PURE__ */ jsx(PopoverLegacyClose, { ...props, ref });
-    return /* @__PURE__ */ jsx(
-      Button,
-      {
-        ref,
-        "data-anv": "popover-close",
-        ...rest,
-        onClick: (event) => {
-          onClick?.(event);
-          if (context?.controlled) {
-            setTimeout(() => {
-              context?.onClose?.();
-            }, 100);
-            return;
-          }
-          context?.popover.close();
-        }
-      }
-    );
-  }
-);
+PopoverButton.displayName = "PopoverButton";
 
 const content = "_content_yo27y_2";
 const scroller = "_scroller_yo27y_29";
@@ -579,6 +580,52 @@ const styles = {
 	"no-padding": "_no-padding_yo27y_62"
 };
 
+function compareElements(el1, el2, excludeAttributes = []) {
+  if (!el1 || !el2 || el1.tagName !== el2.tagName) {
+    return false;
+  }
+  const getFilteredAttributes = (attrs) => {
+    const filtered = {};
+    for (let i = 0; i < attrs.length; i++) {
+      const attr = attrs[i];
+      if (!excludeAttributes.includes(attr.name)) {
+        filtered[attr.name] = attr.value;
+      }
+    }
+    return filtered;
+  };
+  const filteredAttrs1 = getFilteredAttributes(el1.attributes);
+  const filteredAttrs2 = getFilteredAttributes(el2.attributes);
+  const keys1 = Object.keys(filteredAttrs1);
+  const keys2 = Object.keys(filteredAttrs2);
+  if (keys1.length !== keys2.length) return false;
+  for (const key of keys1) {
+    if (filteredAttrs1[key] !== filteredAttrs2[key]) {
+      return false;
+    }
+  }
+  const isOnlyText1 = el1.childNodes.length === 1 && el1.childNodes[0].nodeType === Node.TEXT_NODE;
+  const isOnlyText2 = el2.childNodes.length === 1 && el2.childNodes[0].nodeType === Node.TEXT_NODE;
+  if (isOnlyText1 && isOnlyText2) {
+    if (el1.textContent?.trim() !== el2.textContent?.trim()) {
+      return false;
+    }
+  }
+  const children1 = el1.children;
+  const children2 = el2.children;
+  if (children1.length !== children2.length) return false;
+  for (let i = 0; i < children1.length; i++) {
+    if (!compareElements(
+      children1[i],
+      children2[i],
+      excludeAttributes
+    )) {
+      return false;
+    }
+  }
+  return true;
+}
+
 const PopoverContent = forwardRef(
   function PopoverContent2(props, ref) {
     const {
@@ -732,6 +779,7 @@ const PopoverContent = forwardRef(
     );
   }
 );
+PopoverContent.displayName = "PopoverContent";
 
 function PopoverTrigger(props) {
   const { children } = props;
@@ -742,26 +790,7 @@ function PopoverTrigger(props) {
   const { element, ...rest } = context.invoker;
   return children({ "data-test": "hello", ...rest });
 }
-
-const usePopoverTransitionStates = (popover, openProp, options = {}) => {
-  const { onOpenAnimationStart, onCloseAnimationComplete } = options;
-  return useOpenCloseTransitionStates(openProp, {
-    ...options,
-    onOpenAnimationStart: () => {
-      if (!popover) return;
-      onOpenAnimationStart?.();
-    },
-    onCloseAnimationComplete: () => {
-      if (!popover) return;
-      onCloseAnimationComplete?.();
-    },
-    durationMs: () => {
-      if (!popover) return 0;
-      const duration = window.getComputedStyle(popover).animationDuration;
-      return parseFloat(duration) * 1e3;
-    }
-  });
-};
+PopoverTrigger.displayName = "PopoverTrigger";
 
 const PopoverElement = (props) => {
   const {
@@ -1077,6 +1106,7 @@ const Popover = Object.assign(PopoverElement, {
    * - Accessibility attributes (aria-haspopup, aria-expanded, aria-details)
    * - Legacy popover support with fallback
    * - Context integration with parent popover
+   * - Automatic tracking ID generation for analytics
    *
    * @example
    * <Popover.Trigger>
@@ -1088,22 +1118,6 @@ const Popover = Object.assign(PopoverElement, {
    * </Popover.Trigger>
    */
   Trigger: PopoverTrigger,
-  /**
-   * PopoverClose component for closing the popover.
-   *
-   * Features:
-   * - Automatic popover closing on click
-   * - Supports all Button component props and styling
-   * - Controlled and uncontrolled mode support
-   * - Legacy popover support with fallback
-   * - Context integration with parent popover
-   * - Accessibility support with proper button semantics
-   * - Delayed closing for controlled mode
-   *
-   * @example
-   * <Popover.Close>Close</Popover.Close>
-   */
-  Close: PopoverClose,
   /**
    * PopoverContent component for the main popover content area.
    *
@@ -1127,6 +1141,23 @@ const Popover = Object.assign(PopoverElement, {
    * </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
+   * - Legacy popover support with fallback
+   * - 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.
    *
@@ -1139,13 +1170,13 @@ const Popover = Object.assign(PopoverElement, {
    * - Legacy popover support with fallback
    * - 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,
-  Context: PopoverContext
+  Button: PopoverButton
 });
 
-export { Popover as P, PopoverTrigger as a, PopoverContent as b, PopoverClose as c, PopoverButton as d, PopoverLegacy as e, usePopoverContext as f, usePopoverLegacyContext as u };
-//# sourceMappingURL=Popover-CU2cGVD8-Casl3vM1.js.map
+export { Popover as P, PopoverButton as a, PopoverClose as b, PopoverContent as c, PopoverTrigger as d, PopoverLegacy as e, usePopoverContext as f, usePopoverLegacyContext as u };
+//# sourceMappingURL=Popover-r26xMIfm.js.map