@servicetitan/anvil2 2.6.0 → 2.7.0

package/dist/{Toolbar-4LHKM6ub.js → Toolbar-DAuz4Gs2.js}

@@ -1,36 +1,35 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
 import { useState, useEffect, useContext, createContext, useId, useRef, useCallback, forwardRef, useMemo } from 'react';
-import { B as Button } from './Button-DuvaXRZ5.js';
-import { T as Tooltip } from './Tooltip-BiW5nNAy.js';
+import { B as Button } from './Button-CVsGhVJz.js';
+import { T as Tooltip } from './Tooltip-Bupqao9B.js';
 import { g as getKeyboardFocusableElements } from './getKeyboardFocusableElements-QqcABz0D.js';
-import { c as cx } from './index-SvGbrGuT.js';
+import { c as cx } from './index-De1g9FRV.js';
 import { u as useIntersectionObserver } from './useIntersectionObserver-BEmMDO3P.js';
 import { useTrackingId } from './useTrackingId.js';
-import { B as ButtonToggle } from './ButtonToggle-BkDR0AcM.js';
-import { B as ButtonLink } from './ButtonLink-B5Ixd5d5.js';
+import { B as ButtonToggle } from './ButtonToggle-DaYJWso_.js';
+import { B as ButtonLink } from './ButtonLink-BJKTJER8.js';
 import { S as SvgArrowDropDown } from './arrow_drop_down-ChAdBDux.js';
-import { L as Listbox } from './Listbox-SRBgb1VS.js';
-import { P as Popover } from './Popover-CsVesD9_.js';
-import { F as Flex } from './Flex-DZu-_z-U.js';
+import { L as Listbox } from './Listbox-BtAgBDRS.js';
+import { P as Popover } from './Popover-DxZF6lbJ.js';
+import { F as Flex } from './Flex-WyyZm1bf.js';
 import { S as SvgMoreHoriz } from './more_horiz-DJgdQiy0.js';
 import { S as SvgMoreVert } from './more_vert-C_lJSyxt.js';
-import { I as Icon } from './Icon-Bgkq1egx.js';
-import { P as Popover$1 } from './Popover-ZyaN26OB.js';
+import { I as Icon } from './Icon-DuIlne4x.js';
 import { S as SvgClose } from './close-DZj38AEh.js';
-import { t as tabbable } from './index.esm-BZV0wNKZ.js';
 import { S as SvgKeyboardArrowDown } from './keyboard_arrow_down-C8WQ38p1.js';
 import { S as SvgEvent } from './TimezoneMessage-Cnsl4cHT.js';
 import { D as DateTime } from './luxon-wpz4A-OQ.js';
-import { C as Chip } from './Chip-BJmzOMOd.js';
-import { L as ListView } from './ListView-VzdUffCe.js';
-import { S as SearchField, a as SvgSearch, b as SearchField$1 } from './SearchField-Dn_5cMo3.js';
-import { u as useDateFieldSingleConversion, a as useDateFieldSingleState, M as MaskedDateInput, b as DateFieldSingleCalendar, D as DateFieldSingle } from './DateFieldSingle-CaWruBBO.js';
-import { u as useDateFieldRangeConversion, a as useDateFieldRangeState, M as MaskedDateRangeInput, b as DateFieldRangeCalendar, D as DateFieldRange } from './DateFieldRange-B1BR8K7C.js';
-import { C as Checkbox } from './Checkbox-Czx6UCfq.js';
-import { R as Radio } from './Radio-Beneo_h3.js';
-import { C as Combobox } from './Combobox-CnzBCYLC.js';
-import { D as Drawer } from './Drawer-BmNHRJJJ.js';
+import { C as Chip } from './Chip-DjTAR0va.js';
+import { t as tabbable } from './index.esm-BZV0wNKZ.js';
+import { L as ListView } from './ListView-mujFK6mQ.js';
+import { S as SearchField, a as SvgSearch, b as SearchField$1 } from './SearchField-im7AHGYo.js';
+import { u as useDateFieldSingleConversion, a as useDateFieldSingleState, M as MaskedDateInput, b as DateFieldSingleCalendar, D as DateFieldSingle } from './DateFieldSingle-DrhLIjlK.js';
+import { u as useDateFieldRangeConversion, a as useDateFieldRangeState, M as MaskedDateRangeInput, b as DateFieldRangeCalendar, D as DateFieldRange } from './DateFieldRange-C8Uzrboc.js';
+import { C as Checkbox } from './Checkbox-CjEKa5Iv.js';
+import { R as Radio } from './Radio-BOq9UkpC.js';
+import { C as Combobox } from './Combobox-By8-34bw.js';
+import { D as Drawer } from './Drawer-DA4iAgt-.js';
 import { d as BreakpointSm, c as BreakpointMd, b as BreakpointLg, a as BreakpointXl, B as BreakpointXxl } from './primitive-C3RFDRA8.js';
 import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DMDdfIah.js';
@@ -466,7 +465,6 @@ const ToolbarSelect = forwardRef(
       ...rest
     } = props;
     const selectId = useId();
-    const popoverContentRef = useRef(null);
     const [isPopoverOpen, setIsPopoverOpen] = useState(false);
     const defaultId = items.length > 0 ? items[0].id : "";
     const [internalSelectedId, setInternalSelectedId] = useState(defaultId);
@@ -477,18 +475,6 @@ const ToolbarSelect = forwardRef(
         setInternalSelectedId(items[0].id);
       }
     }, [items, selectedItemId, internalSelectedId]);
-    const prevIsPopoverOpen = useRef(isPopoverOpen);
-    useEffect(() => {
-      if (prevIsPopoverOpen.current && !isPopoverOpen) {
-        setTimeout(() => {
-          const triggerButton = document.getElementById(selectId);
-          if (triggerButton) {
-            triggerButton.focus();
-          }
-        });
-      }
-      prevIsPopoverOpen.current = isPopoverOpen;
-    }, [isPopoverOpen, selectId]);
     const handleSelectionChange = (selected) => {
       if (selected?.id) {
         if (selectedItemId === void 0) {
@@ -498,18 +484,6 @@ const ToolbarSelect = forwardRef(
         setIsPopoverOpen(false);
       }
     };
-    const handleKeyDown = (event) => {
-      if (event.code === "ArrowDown" && isPopoverOpen) {
-        const listboxContainer = popoverContentRef.current?.querySelector(
-          '[role="listbox"]'
-        );
-        if (listboxContainer) {
-          listboxContainer.focus();
-        }
-        event.stopPropagation();
-        event.preventDefault();
-      }
-    };
     const { isInOverflowMenu = false } = useOverFlowItemContext?.() || {};
     const toolbarSize = useToolbarSize();
     const trackingId = useTrackingId({
@@ -548,7 +522,6 @@ const ToolbarSelect = forwardRef(
               onClick: () => {
                 setIsPopoverOpen(!isPopoverOpen);
               },
-              onKeyDown: handleKeyDown,
               ...rest,
               children: selectedItem?.label
             }
@@ -556,9 +529,8 @@ const ToolbarSelect = forwardRef(
           /* @__PURE__ */ jsx(
             Popover.Content,
             {
-              ref: popoverContentRef,
               className: styles$3["toolbar-select-content"],
-              "aria-label": `${accessibleLabel} options`,
+              "aria-label": accessibleLabel,
               children: /* @__PURE__ */ jsx(
                 Listbox,
                 {
@@ -615,9 +587,9 @@ const ToolbarOverflowMenu = ({
     styles$3["toolbar-overflow-trigger"]
   );
   const overflowIcon = direction === "horizontal" ? SvgMoreHoriz : SvgMoreVert;
-  return /* @__PURE__ */ jsxs(Popover$1, { noPadding: true, children: [
+  return /* @__PURE__ */ jsxs(Popover, { noPadding: true, children: [
     /* @__PURE__ */ jsx(
-      Popover$1.Button,
+      Popover.Button,
       {
         size,
         appearance: "ghost",
@@ -628,7 +600,7 @@ const ToolbarOverflowMenu = ({
         children: /* @__PURE__ */ jsx(Icon, { svg: overflowIcon, size: size === "xsmall" ? "small" : size })
       }
     ),
-    /* @__PURE__ */ jsx(Popover$1.Content, { children: /* @__PURE__ */ jsx(OverflowItemContext.Provider, { value: { isInOverflowMenu: true }, children: /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(Popover.Content, { children: /* @__PURE__ */ jsx(OverflowItemContext.Provider, { value: { isInOverflowMenu: true }, children: /* @__PURE__ */ jsxs(
       "ul",
       {
         role: "menu",
@@ -1193,8 +1165,6 @@ const FilterButton = ({
     filter.type === "multiSelect" ? [] : void 0
   );
   const draftValueRef = useRef(draftValue);
-  const triggerRef = useRef(null);
-  const contentRef = useRef(null);
   useEffect(() => {
     draftValueRef.current = draftValue;
   }, [draftValue]);
@@ -1236,9 +1206,6 @@ const FilterButton = ({
           updateFilter(filter.id, value, true);
           if (filter.type !== "multiSelect") {
             setIsOpen(false);
-            requestAnimationFrame(() => {
-              triggerRef.current?.focus();
-            });
           }
         }
       }
@@ -1251,24 +1218,15 @@ const FilterButton = ({
       updateFilter(filter.id, draftValue, true);
     }
     setIsOpen(false);
-    requestAnimationFrame(() => {
-      triggerRef.current?.focus();
-    });
   }, [draftValue, getCurrentFilterValue, filter.id, updateFilter]);
   const handleCancel = useCallback(() => {
     if (!controlledFiltering) {
       setIsOpen(false);
-      requestAnimationFrame(() => {
-        triggerRef.current?.focus();
-      });
       return;
     }
     const originalValue = getCurrentFilterValue();
     setDraftValue(originalValue);
     setIsOpen(false);
-    requestAnimationFrame(() => {
-      triggerRef.current?.focus();
-    });
   }, [controlledFiltering, getCurrentFilterValue]);
   const getButtonLabel = useMemo(() => {
     switch (filter.type) {
@@ -1389,9 +1347,6 @@ const FilterButton = ({
       handleCancel();
     } else if (filter.type === "multiSelect") {
       setIsOpen(false);
-      requestAnimationFrame(() => {
-        triggerRef.current?.focus();
-      });
     } else {
       handleSubmit();
     }
@@ -1402,37 +1357,6 @@ const FilterButton = ({
         handleSubmit();
       }
     }
-    if (e.key === "Escape") {
-      handleOutsidePress();
-    }
-    if (e.key === "Tab" && contentRef.current) {
-      const focusableElements = tabbable(contentRef.current);
-      if (focusableElements.length === 0) return;
-      const firstElement = focusableElements[0];
-      const lastElement = focusableElements[focusableElements.length - 1];
-      const activeElement = document.activeElement;
-      if (e.shiftKey && activeElement === firstElement) {
-        e.preventDefault();
-        lastElement.focus();
-      } else if (!e.shiftKey && activeElement === lastElement) {
-        e.preventDefault();
-        firstElement.focus();
-      }
-    }
-  };
-  const handleTriggerKeyDown = (e) => {
-    if (e.key === "ArrowDown") {
-      if (isOpen && contentRef.current) {
-        e.preventDefault();
-        requestAnimationFrame(() => {
-          if (!contentRef.current) return;
-          const focusableElements = tabbable(contentRef.current);
-          if (focusableElements.length > 0) {
-            focusableElements[0].focus();
-          }
-        });
-      }
-    }
   };
   const triggerClasses = cx(styles$2["filter-button-trigger"], {
     [styles$2["filter-button-trigger--selected"]]: filter.type === "custom" && filter.value || filter.type === "singleSelect" && filter.selectedItem || filter.type === "multiSelect" && filter.selectedItems && filter.selectedItems.length > 0 || filter.type === "date" && filter.value || filter.type === "dateRange" && filter.value?.startDate && filter.value?.endDate
@@ -1443,18 +1367,14 @@ const FilterButton = ({
     Popover,
     {
       open: isOpen,
-      onClickOutside: isOpen ? handleOutsidePress : void 0,
+      onClose: handleOutsidePress,
       placement: "bottom-start",
+      modal: true,
       noPadding: filter.type === "multiSelect" || filter.type === "singleSelect",
       children: [
         /* @__PURE__ */ jsx(
           Popover.Button,
           {
-            ref: triggerRef,
-            onKeyDown: (e) => {
-              handleTriggerKeyDown(e);
-              handleKeyDown(e);
-            },
             appearance: "ghost",
             size: toolbarSize,
             icon: iconOptions,
@@ -1467,29 +1387,21 @@ const FilterButton = ({
             children: getButtonLabel
           }
         ),
-        /* @__PURE__ */ jsxs(
-          Popover.Content,
-          {
-            ref: contentRef,
-            onKeyDown: handleKeyDown,
-            className: contentClasses,
-            children: [
-              getContent,
-              controlledFiltering && /* @__PURE__ */ jsxs(
-                Flex,
-                {
-                  gap: 2,
-                  justifyContent: "flex-end",
-                  className: styles$2["filter-button-buttons"],
-                  children: [
-                    /* @__PURE__ */ jsx(Popover.Close, { size: "small", onClick: handleCancel, children: "Cancel" }),
-                    /* @__PURE__ */ jsx(Button, { appearance: "primary", size: "small", onClick: handleSubmit, children: "Apply" })
-                  ]
-                }
-              )
-            ]
-          }
-        )
+        /* @__PURE__ */ jsxs(Popover.Content, { onKeyDown: handleKeyDown, className: contentClasses, children: [
+          getContent,
+          controlledFiltering && /* @__PURE__ */ jsxs(
+            Flex,
+            {
+              gap: 2,
+              justifyContent: "flex-end",
+              className: styles$2["filter-button-buttons"],
+              children: [
+                /* @__PURE__ */ jsx(Popover.Close, { size: "small", children: "Cancel" }),
+                /* @__PURE__ */ jsx(Button, { appearance: "primary", size: "small", onClick: handleSubmit, children: "Apply" })
+              ]
+            }
+          )
+        ] })
       ]
     }
   ) });
@@ -2338,4 +2250,4 @@ const Toolbar = Object.assign(ToolbarElement, {
 });
 
 export { Toolbar as T, ToolbarButton as a, ToolbarButtonToggle as b, ToolbarButtonLink as c, ToolbarSelect as d, ToolbarControlGroup as e, ToolbarSearchField as f, ToolbarElement as g };
-//# sourceMappingURL=Toolbar-4LHKM6ub.js.map
+//# sourceMappingURL=Toolbar-DAuz4Gs2.js.map