@jmruthers/pace-core 0.6.4 → 0.6.5

package/dist/{chunk-7JPAB3T5.js → chunk-IVOFDYWT.js}

@@ -1,17 +1,18 @@
 import {
   useCan,
   useResolvedScope
-} from "./chunk-NN6WWZ5U.js";
+} from "./chunk-HU2C6SSC.js";
 import {
   toast,
-  useDataTablePerformance
-} from "./chunk-6SOIHG6Z.js";
+  useDataTablePerformance,
+  useFocusTrap
+} from "./chunk-JGRYX5UX.js";
 import {
   useUnifiedAuth
-} from "./chunk-AVMLPIM7.js";
+} from "./chunk-IHB5DR3H.js";
 import {
   isSuperAdmin
-} from "./chunk-3LPHPB62.js";
+} from "./chunk-EFN2EIMK.js";
 import {
   cn,
   renderSafeHtml
@@ -24,7 +25,7 @@ import {
 import React30 from "react";
 
 // src/components/DataTable/components/DataTableCore.tsx
-import { useMemo as useMemo14, useCallback as useCallback11, useEffect as useEffect16, useRef as useRef9 } from "react";
+import { useMemo as useMemo14, useCallback as useCallback12, useEffect as useEffect16, useRef as useRef10 } from "react";
 import { useReactTable } from "@tanstack/react-table";
 import { Edit as Edit2, Trash as Trash3 } from "lucide-react";
 
@@ -3297,13 +3298,13 @@ function EnhancedPaginationControls({
 import { useEffect as useEffect8 } from "react";
 
 // src/components/DataTable/components/ImportModal.tsx
-import { useState as useState5, useRef as useRef5, useEffect as useEffect7 } from "react";
+import { useState as useState5, useRef as useRef6, useEffect as useEffect7 } from "react";
 
 // src/components/Dialog/Dialog.tsx
 import * as React19 from "react";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { createPortal } from "react-dom";
 import { X as X4 } from "lucide-react";
-import { useState as useState4, useEffect as useEffect6 } from "react";
+import { useState as useState4, useEffect as useEffect6, useRef as useRef5, useCallback as useCallback4, useId } from "react";
 import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
 function debounce(func, wait) {
   let timeoutId = null;
@@ -3323,6 +3324,14 @@ function debounce(func, wait) {
   };
   return debounced;
 }
+var DialogContext = React19.createContext(null);
+function useDialogContext() {
+  const context = React19.useContext(DialogContext);
+  if (!context) {
+    throw new Error("Dialog components must be used within a Dialog");
+  }
+  return context;
+}
 var sizeClasses = {
   sm: "max-w-sm",
   md: "max-w-md",
@@ -3331,22 +3340,79 @@ var sizeClasses = {
   full: "max-w-full size-full",
   auto: "max-w-none w-auto min-w-0"
 };
-var Dialog = DialogPrimitive.Root;
-var DialogTrigger = DialogPrimitive.Trigger;
-var DialogPortal = DialogPrimitive.Portal;
-var DialogClose = DialogPrimitive.Close;
-var DialogOverlay = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
-  DialogPrimitive.Overlay,
-  {
-    ref,
-    className: cn(
-      "fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
-    ),
-    ...props
+var Dialog = React19.memo(function Dialog2({
+  children,
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange
+}) {
+  const [internalOpen, setInternalOpen] = useState4(defaultOpen);
+  const dialogRef = useRef5(null);
+  const titleId = useId();
+  const descriptionId = useId();
+  const isControlled = controlledOpen !== void 0;
+  const open = isControlled ? controlledOpen : internalOpen;
+  const handleOpenChange = useCallback4((newOpen) => {
+    if (!isControlled) {
+      setInternalOpen(newOpen);
+    }
+    onOpenChange?.(newOpen);
+  }, [isControlled, onOpenChange]);
+  const contextValue = React19.useMemo(() => ({
+    open,
+    onOpenChange: handleOpenChange,
+    dialogRef,
+    titleId,
+    descriptionId
+  }), [open, handleOpenChange, titleId, descriptionId]);
+  return /* @__PURE__ */ jsx19(DialogContext.Provider, { value: contextValue, children });
+});
+Dialog.displayName = "Dialog";
+var DialogTrigger = React19.forwardRef(
+  ({ children, asChild = false, className, onClick, ...props }, ref) => {
+    const { onOpenChange } = useDialogContext();
+    const handleClick = useCallback4((e) => {
+      onClick?.(e);
+      onOpenChange(true);
+    }, [onOpenChange, onClick]);
+    if (asChild && React19.isValidElement(children)) {
+      return React19.cloneElement(children, {
+        ref,
+        onClick: handleClick,
+        className: cn(className, children.props?.className),
+        ...props
+      });
+    }
+    return /* @__PURE__ */ jsx19(
+      "button",
+      {
+        ref,
+        type: "button",
+        onClick: handleClick,
+        className,
+        ...props,
+        children
+      }
+    );
   }
-));
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+);
+DialogTrigger.displayName = "DialogTrigger";
+var DialogPortal = ({ children }) => {
+  const [mounted, setMounted] = useState4(false);
+  useEffect6(() => {
+    setMounted(true);
+    return () => setMounted(false);
+  }, []);
+  if (!mounted) return null;
+  return createPortal(children, document.body);
+};
+DialogPortal.displayName = "DialogPortal";
+var DialogOverlay = React19.forwardRef(
+  ({ className, ...props }, ref) => {
+    return null;
+  }
+);
+DialogOverlay.displayName = "DialogOverlay";
 var useSmartDimensions = ({
   maxHeightPercent,
   maxWidthPercent,
@@ -3412,74 +3478,134 @@ var useSmartDimensions = ({
   }
   return result;
 };
-var DialogContent = React19.forwardRef(({
-  className,
-  children,
-  size = "md",
-  showCloseButton = true,
-  overlayClassName,
-  preventCloseOnEscape = false,
-  preventCloseOnOutsideClick = false,
-  maxHeightPercent,
-  maxWidthPercent,
-  enableScrolling = false,
-  maxHeight,
-  maxWidth,
-  minHeight,
-  minWidth,
-  style,
-  ...props
-}, ref) => {
-  const smartDimensions = useSmartDimensions({
+var DialogContent = React19.forwardRef(
+  ({
+    className,
+    children,
+    size = "md",
+    showCloseButton = true,
+    preventCloseOnEscape = false,
+    preventCloseOnOutsideClick = false,
     maxHeightPercent,
     maxWidthPercent,
+    enableScrolling = false,
     maxHeight,
     maxWidth,
     minHeight,
     minWidth,
-    enableScrolling
-  });
-  const handleEscapeKeyDown = (event) => {
-    if (preventCloseOnEscape) {
-      event.preventDefault();
-    }
-  };
-  const handlePointerDownOutside = (event) => {
-    if (preventCloseOnOutsideClick) {
-      event.preventDefault();
-    }
-  };
-  const mergedStyle = React19.useMemo(() => {
-    if (Object.keys(smartDimensions).length === 0) {
-      return style;
-    }
-    const finalStyle = { ...smartDimensions, ...style };
-    if (!maxWidth && !maxWidthPercent) {
-      const { maxWidth: _, ...styleWithoutMaxWidth } = finalStyle;
-      return styleWithoutMaxWidth;
-    }
-    return finalStyle;
-  }, [smartDimensions, style, maxWidth, maxWidthPercent]);
-  return /* @__PURE__ */ jsxs15(DialogPortal, { children: [
-    /* @__PURE__ */ jsx19(DialogOverlay, { className: overlayClassName }),
-    /* @__PURE__ */ jsxs15(
-      DialogPrimitive.Content,
+    title,
+    description,
+    style,
+    ...props
+  }, ref) => {
+    const { open, onOpenChange, dialogRef, titleId, descriptionId } = useDialogContext();
+    const internalRef = useRef5(null);
+    const actualDialogRef = dialogRef.current ? dialogRef : ref ? ref : internalRef;
+    const smartDimensions = useSmartDimensions({
+      maxHeightPercent,
+      maxWidthPercent,
+      maxHeight,
+      maxWidth,
+      minHeight,
+      minWidth,
+      enableScrolling
+    });
+    const { containerRef } = useFocusTrap({
+      isActive: open,
+      autoFocus: true,
+      restoreFocus: true,
+      onEscape: preventCloseOnEscape ? void 0 : () => onOpenChange(false)
+    });
+    const mergedRef = useCallback4((node) => {
+      if (dialogRef && "current" in dialogRef) {
+        dialogRef.current = node;
+      }
+      if (internalRef && "current" in internalRef) {
+        internalRef.current = node;
+      }
+      if (containerRef && "current" in containerRef) {
+        containerRef.current = node;
+      }
+      if (typeof ref === "function") {
+        ref(node);
+      } else if (ref && "current" in ref) {
+        ref.current = node;
+      }
+    }, [dialogRef, containerRef, ref]);
+    useEffect6(() => {
+      const dialog = dialogRef.current || internalRef.current;
+      if (!dialog) return;
+      if (open) {
+        requestAnimationFrame(() => {
+          if (dialog && open) {
+            dialog.showModal();
+          }
+        });
+      } else {
+        if (dialog.open) {
+          dialog.close();
+        }
+      }
+    }, [open, dialogRef]);
+    useEffect6(() => {
+      const dialog = dialogRef.current || internalRef.current;
+      if (!dialog) return;
+      const handleClose = () => {
+        if (!dialog.open && open) {
+          onOpenChange(false);
+        }
+      };
+      dialog.addEventListener("close", handleClose);
+      return () => {
+        dialog.removeEventListener("close", handleClose);
+      };
+    }, [open, onOpenChange, dialogRef]);
+    useEffect6(() => {
+      const dialog = dialogRef.current || internalRef.current;
+      if (!dialog) return;
+      const handleCancel = (e) => {
+        if (preventCloseOnEscape || preventCloseOnOutsideClick) {
+          e.preventDefault();
+          return;
+        }
+        onOpenChange(false);
+      };
+      dialog.addEventListener("cancel", handleCancel);
+      return () => {
+        dialog.removeEventListener("cancel", handleCancel);
+      };
+    }, [preventCloseOnEscape, preventCloseOnOutsideClick, onOpenChange, dialogRef]);
+    const mergedStyle = React19.useMemo(() => {
+      if (Object.keys(smartDimensions).length === 0) {
+        return style;
+      }
+      const finalStyle = { ...smartDimensions, ...style };
+      if (!maxWidth && !maxWidthPercent) {
+        const { maxWidth: _, ...styleWithoutMaxWidth } = finalStyle;
+        return styleWithoutMaxWidth;
+      }
+      return finalStyle;
+    }, [smartDimensions, style, maxWidth, maxWidthPercent]);
+    return /* @__PURE__ */ jsx19(DialogPortal, { children: open && /* @__PURE__ */ jsxs15(
+      "dialog",
       {
-        ref,
-        onEscapeKeyDown: preventCloseOnEscape ? handleEscapeKeyDown : void 0,
-        onPointerDownOutside: handlePointerDownOutside,
+        ref: mergedRef,
         className: cn(
-          "fixed left-[50%] top-[50%] z-[51] w-full translate-x-[-50%] translate-y-[-50%] border bg-background shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-          // Reset native dialog styles that interfere with our custom styling
+          "fixed left-[50%] top-[50%] z-[51] w-full translate-x-[-50%] translate-y-[-50%] border bg-background shadow-lg duration-200",
+          "animate-in fade-in-0 zoom-in-95 slide-in-from-left-1/2 slide-in-from-top-[48%]",
+          "sm:rounded-lg",
+          // Reset native dialog styles
           "m-0 p-0 max-w-none max-h-none w-auto h-auto border-0 bg-transparent outline-none",
           // Apply our custom styling
           "border bg-background shadow-lg",
+          // Style native backdrop pseudo-element (Tailwind v4 supports arbitrary variants)
+          "[&::backdrop]:bg-black/50 [&::backdrop]:animate-in [&::backdrop]:fade-in-0",
           // Only apply size classes if not using smart width
           !maxWidth && !maxWidthPercent && sizeClasses[size],
-          // Auto size gets special handling for content fitting
+          // Auto size gets special handling
           size === "auto" && "w-fit max-w-[90vw] sm:max-w-[80vw]",
           // Layout classes based on scrolling mode
-          enableScrolling ? "flex flex-col" : "grid gap-4 p-6",
+          enableScrolling ? "flex flex-col px-6" : "grid gap-4 p-6",
           // Full screen handling
           size === "full" && "sm:left-[50%] sm:top-[50%] sm:translate-x-[-50%] sm:translate-y-[-50%] left-0 top-0 translate-x-0 translate-y-0 h-full rounded-none sm:h-auto sm:rounded-lg",
           // Overflow handling for scrolling mode
@@ -3487,19 +3613,45 @@ var DialogContent = React19.forwardRef(({
           className
         ),
         style: mergedStyle,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-labelledby": titleId,
+        "aria-describedby": descriptionId,
+        title,
+        "aria-description": description,
         ...props,
         children: [
           children,
-          showCloseButton && /* @__PURE__ */ jsxs15(DialogPrimitive.Close, { className: "absolute right-4 top-4 z-10 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
-            /* @__PURE__ */ jsx19(X4, { className: "size-4" }),
-            /* @__PURE__ */ jsx19("span", { className: "sr-only", children: "Close" })
-          ] })
+          showCloseButton && /* @__PURE__ */ jsx19(DialogClose, {})
         ]
       }
-    )
-  ] });
-});
-DialogContent.displayName = DialogPrimitive.Content.displayName;
+    ) });
+  }
+);
+DialogContent.displayName = "DialogContent";
+var DialogClose = React19.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { onOpenChange } = useDialogContext();
+    return /* @__PURE__ */ jsxs15(
+      "button",
+      {
+        ref,
+        type: "button",
+        onClick: () => onOpenChange(false),
+        className: cn(
+          "absolute right-4 top-4 z-10 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx19(X4, { className: "size-4" }),
+          /* @__PURE__ */ jsx19("span", { className: "sr-only", children: "Close" })
+        ]
+      }
+    );
+  }
+);
+DialogClose.displayName = "DialogClose";
 var DialogHeader = ({
   className,
   sticky = false,
@@ -3509,7 +3661,7 @@ var DialogHeader = ({
   {
     className: cn(
       "flex flex-col space-y-1.5 text-center sm:text-left",
-      sticky ? "sticky top-0 z-10 bg-background p-6 pb-4 border-b" : "p-6 pb-4",
+      sticky ? "sticky top-0 z-10 bg-background pt-6 pb-4 border-b" : "py-2",
       className
     ),
     ...props
@@ -3548,7 +3700,7 @@ var DialogBody = ({
     "main",
     {
       className: cn(
-        "overflow-y-auto px-6 py-2",
+        "overflow-y-auto py-2",
         className
       ),
       style: mergedStyle,
@@ -3556,13 +3708,13 @@ var DialogBody = ({
       tabIndex: -1,
       ...props,
       children: processedHtmlContent ? /* @__PURE__ */ jsx19(
-        "div",
+        "p",
         {
           dangerouslySetInnerHTML: { __html: processedHtmlContent },
           className: "prose prose-sm max-w-none"
         }
       ) : /* @__PURE__ */ jsxs15(Fragment3, { children: [
-        hasHtmlContent && !processedHtmlContent && /* @__PURE__ */ jsx19("div", { className: "text-acc-500 mb-2", children: "No HTML content processed. Showing children instead." }),
+        hasHtmlContent && !processedHtmlContent && /* @__PURE__ */ jsx19("p", { className: "text-acc-500 mb-2", children: "No HTML content processed. Showing children instead." }),
         children
       ] })
     }
@@ -3577,61 +3729,66 @@ var DialogFooter = ({
   "footer",
   {
     className: cn(
-      // Only apply default layout classes if no custom className is provided
       !className && "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      !className && (sticky ? "sticky bottom-0 z-10 bg-background p-6 pt-4 border-t" : "p-6 pt-4"),
+      !className && (sticky ? "sticky bottom-0 z-10 bg-background pt-4 pb-6 border-t" : "py-2"),
       className
     ),
     ...props
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React19.forwardRef(({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
-  const processedHtmlContent = React19.useMemo(() => {
-    if (!htmlContent || !allowHtml) {
-      return null;
-    }
-    const result = renderSafeHtml(htmlContent, {
-      strict: true,
-      logWarnings: false
-    });
-    return result.html;
-  }, [htmlContent, allowHtml]);
-  return /* @__PURE__ */ jsx19(
-    DialogPrimitive.Title,
-    {
-      ref,
-      className: cn(
-        className
-      ),
-      ...props,
-      children: processedHtmlContent ? /* @__PURE__ */ jsx19("span", { dangerouslySetInnerHTML: { __html: processedHtmlContent } }) : children
-    }
-  );
-});
-DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React19.forwardRef(({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
-  const processedHtmlContent = React19.useMemo(() => {
-    if (!htmlContent || !allowHtml) {
-      return null;
-    }
-    const result = renderSafeHtml(htmlContent, {
-      strict: true,
-      logWarnings: false
-    });
-    return result.html;
-  }, [htmlContent, allowHtml]);
-  return /* @__PURE__ */ jsx19(DialogPrimitive.Description, { asChild: true, children: /* @__PURE__ */ jsx19(
-    "h5",
-    {
-      ref,
-      className: cn(className),
-      ...props,
-      children: processedHtmlContent ? /* @__PURE__ */ jsx19("span", { dangerouslySetInnerHTML: { __html: processedHtmlContent } }) : children
-    }
-  ) });
-});
-DialogDescription.displayName = DialogPrimitive.Description.displayName;
+var DialogTitle = React19.forwardRef(
+  ({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
+    const { titleId } = useDialogContext();
+    const processedHtmlContent = React19.useMemo(() => {
+      if (!htmlContent || !allowHtml) {
+        return null;
+      }
+      const result = renderSafeHtml(htmlContent, {
+        strict: true,
+        logWarnings: false
+      });
+      return result.html;
+    }, [htmlContent, allowHtml]);
+    return /* @__PURE__ */ jsx19(
+      "h2",
+      {
+        ref,
+        id: titleId,
+        className: cn(className),
+        ...props,
+        children: processedHtmlContent ? /* @__PURE__ */ jsx19("span", { dangerouslySetInnerHTML: { __html: processedHtmlContent } }) : children
+      }
+    );
+  }
+);
+DialogTitle.displayName = "DialogTitle";
+var DialogDescription = React19.forwardRef(
+  ({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
+    const { descriptionId } = useDialogContext();
+    const processedHtmlContent = React19.useMemo(() => {
+      if (!htmlContent || !allowHtml) {
+        return null;
+      }
+      const result = renderSafeHtml(htmlContent, {
+        strict: true,
+        logWarnings: false
+      });
+      return result.html;
+    }, [htmlContent, allowHtml]);
+    return /* @__PURE__ */ jsx19(
+      "p",
+      {
+        ref,
+        id: descriptionId,
+        className: cn(className),
+        ...props,
+        children: processedHtmlContent ? /* @__PURE__ */ jsx19("span", { dangerouslySetInnerHTML: { __html: processedHtmlContent } }) : children
+      }
+    );
+  }
+);
+DialogDescription.displayName = "DialogDescription";
 
 // src/components/Progress/Progress.tsx
 import * as React20 from "react";
@@ -3667,8 +3824,8 @@ function ImportModal({ isOpen, onClose, onImport, config = {} }) {
   const [totalCount, setTotalCount] = useState5(0);
   const [validationErrors, setValidationErrors] = useState5([]);
   const [importProgress, setImportProgress] = useState5(null);
-  const fileInputRef = useRef5(null);
-  const isMountedRef = useRef5(true);
+  const fileInputRef = useRef6(null);
+  const isMountedRef = useRef6(true);
   useEffect7(() => {
     return () => {
       isMountedRef.current = false;
@@ -3858,10 +4015,10 @@ function ImportModal({ isOpen, onClose, onImport, config = {} }) {
       }
     }
   };
-  return /* @__PURE__ */ jsx21(Dialog, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs16(DialogContent, { className: "sm:max-w-2xl bg-main-50", children: [
+  return /* @__PURE__ */ jsx21(Dialog, { open: isOpen, onOpenChange: handleClose, children: /* @__PURE__ */ jsxs16(DialogContent, { className: "sm:max-w-2xl bg-main-50", title, description, children: [
     /* @__PURE__ */ jsxs16(DialogHeader, { children: [
-      /* @__PURE__ */ jsx21(DialogTitle, { children: title }),
-      /* @__PURE__ */ jsx21(DialogDescription, { children: description })
+      /* @__PURE__ */ jsx21("h2", { children: title }),
+      /* @__PURE__ */ jsx21("p", { children: description })
     ] }),
     /* @__PURE__ */ jsxs16("div", { className: "space-y-4", children: [
       /* @__PURE__ */ jsxs16("div", { className: "border-2 border-dashed border-sec-200 rounded-lg p-6 text-center", children: [
@@ -4946,7 +5103,7 @@ var DataTableErrorBoundary = class extends Component {
 };
 
 // src/components/DataTable/hooks/useColumnOrderPersistence.ts
-import { useState as useState6, useEffect as useEffect9, useCallback as useCallback4 } from "react";
+import { useState as useState6, useEffect as useEffect9, useCallback as useCallback5 } from "react";
 function useColumnOrderPersistence({
   tableId,
   defaultOrder = [],
@@ -4980,7 +5137,7 @@ function useColumnOrderPersistence({
       setIsLoaded(true);
     }
   }, [enablePersistence, finalStorageKey, storageKey, tableId]);
-  const saveColumnOrder = useCallback4((newOrder) => {
+  const saveColumnOrder = useCallback5((newOrder) => {
     if (!enablePersistence || typeof window === "undefined") return;
     if (!storageKey && !tableId) return;
     try {
@@ -4989,11 +5146,11 @@ function useColumnOrderPersistence({
       logger2.warn("Failed to save column order to localStorage:", error);
     }
   }, [enablePersistence, finalStorageKey, storageKey, tableId]);
-  const updateColumnOrder = useCallback4((newOrder) => {
+  const updateColumnOrder = useCallback5((newOrder) => {
     setColumnOrder(newOrder);
     saveColumnOrder(newOrder);
   }, [saveColumnOrder]);
-  const resetColumnOrder = useCallback4(() => {
+  const resetColumnOrder = useCallback5(() => {
     setColumnOrder(defaultOrder);
     if (enablePersistence && (storageKey || tableId) && typeof window !== "undefined") {
       try {
@@ -5003,7 +5160,7 @@ function useColumnOrderPersistence({
       }
     }
   }, [defaultOrder, enablePersistence, finalStorageKey, storageKey, tableId]);
-  const clearAllPreferences = useCallback4(() => {
+  const clearAllPreferences = useCallback5(() => {
     if (!enablePersistence || typeof window === "undefined") return;
     try {
       const keys = Object.keys(localStorage);
@@ -5026,7 +5183,7 @@ function useColumnOrderPersistence({
 }
 
 // src/components/DataTable/hooks/useColumnVisibilityPersistence.ts
-import { useState as useState7, useEffect as useEffect10, useCallback as useCallback5 } from "react";
+import { useState as useState7, useEffect as useEffect10, useCallback as useCallback6 } from "react";
 function useColumnVisibilityPersistence({
   tableId,
   defaultVisibility = {},
@@ -5056,7 +5213,7 @@ function useColumnVisibilityPersistence({
       setIsLoaded(true);
     }
   }, [enablePersistence, finalStorageKey]);
-  const saveColumnVisibility = useCallback5((newVisibility) => {
+  const saveColumnVisibility = useCallback6((newVisibility) => {
     if (!enablePersistence || typeof window === "undefined") return;
     try {
       localStorage.setItem(finalStorageKey, JSON.stringify(newVisibility));
@@ -5064,11 +5221,11 @@ function useColumnVisibilityPersistence({
       logger2.warn("Failed to save column visibility to localStorage:", error);
     }
   }, [enablePersistence, finalStorageKey]);
-  const updateColumnVisibility = useCallback5((newVisibility) => {
+  const updateColumnVisibility = useCallback6((newVisibility) => {
     setColumnVisibility(newVisibility);
     saveColumnVisibility(newVisibility);
   }, [saveColumnVisibility]);
-  const resetColumnVisibility = useCallback5(() => {
+  const resetColumnVisibility = useCallback6(() => {
     setColumnVisibility(defaultVisibility);
     if (enablePersistence && typeof window !== "undefined") {
       try {
@@ -5078,7 +5235,7 @@ function useColumnVisibilityPersistence({
       }
     }
   }, [defaultVisibility, enablePersistence, finalStorageKey]);
-  const clearAllPreferences = useCallback5(() => {
+  const clearAllPreferences = useCallback6(() => {
     if (!enablePersistence || typeof window === "undefined") return;
     try {
       const keys = Object.keys(localStorage);
@@ -5101,7 +5258,7 @@ function useColumnVisibilityPersistence({
 }
 
 // src/components/DataTable/hooks/useDataTableState.ts
-import { useReducer, useCallback as useCallback6, useMemo as useMemo6 } from "react";
+import { useReducer, useCallback as useCallback7, useMemo as useMemo6 } from "react";
 function dataTableReducer(state, action) {
   switch (action.type) {
     case "SET_SORTING":
@@ -5237,7 +5394,7 @@ function useDataTableState({
     hasFilters: state.columnFilters.length > 0 || state.searchQuery !== "",
     canClearFilters: state.columnFilters.length > 0 || state.searchQuery !== ""
   }), [state]);
-  const clearFilters = useCallback6(() => {
+  const clearFilters = useCallback7(() => {
     dispatch({ type: "SET_COLUMN_FILTERS", payload: [] });
     dispatch({ type: "SET_SEARCH_QUERY", payload: "" });
   }, []);
@@ -5253,7 +5410,7 @@ function useDataTableState({
 import { useMemo as useMemo8 } from "react";
 
 // src/components/DataTable/hooks/useHierarchicalState.ts
-import { useState as useState8, useCallback as useCallback7, useMemo as useMemo7, useEffect as useEffect11 } from "react";
+import { useState as useState8, useCallback as useCallback8, useMemo as useMemo7, useEffect as useEffect11 } from "react";
 function useHierarchicalState(data, config) {
   const initialExpandedState = useMemo7(() => {
     if (!config?.defaultExpanded) {
@@ -5315,7 +5472,7 @@ function useHierarchicalState(data, config) {
     }
     return visible;
   }, [data, expandedRows, parentChildMap]);
-  const toggleRow = useCallback7((rowId) => {
+  const toggleRow = useCallback8((rowId) => {
     setExpandedRows((prev) => {
       const newSet = new Set(prev);
       if (newSet.has(rowId)) {
@@ -5329,32 +5486,32 @@ function useHierarchicalState(data, config) {
       return newSet;
     });
   }, [config]);
-  const expandAll = useCallback7(() => {
+  const expandAll = useCallback8(() => {
     const parentIds = data.filter((row) => row.isParent).map((row) => row.id);
     setExpandedRows(new Set(parentIds));
     if (config?.onExpandedChange) {
       config.onExpandedChange(parentIds);
     }
   }, [data, config]);
-  const collapseAll = useCallback7(() => {
+  const collapseAll = useCallback8(() => {
     setExpandedRows(/* @__PURE__ */ new Set());
     if (config?.onExpandedChange) {
       config.onExpandedChange([]);
     }
   }, [config]);
-  const isExpanded = useCallback7((rowId) => {
+  const isExpanded = useCallback8((rowId) => {
     return expandedRows.has(rowId);
   }, [expandedRows]);
-  const hasChildren = useCallback7((rowId) => {
+  const hasChildren = useCallback8((rowId) => {
     return parentChildMap.has(rowId) && (parentChildMap.get(rowId)?.length || 0) > 0;
   }, [parentChildMap]);
-  const getChildrenCount = useCallback7((rowId) => {
+  const getChildrenCount = useCallback8((rowId) => {
     return parentChildMap.get(rowId)?.length || 0;
   }, [parentChildMap]);
-  const getExpandedIds = useCallback7(() => {
+  const getExpandedIds = useCallback8(() => {
     return Array.from(expandedRows);
   }, [expandedRows]);
-  const setExpandedIds = useCallback7((ids) => {
+  const setExpandedIds = useCallback8((ids) => {
     setExpandedRows(new Set(ids));
   }, []);
   return {
@@ -5535,7 +5692,7 @@ function useDataTableDataPipeline({
 }
 
 // src/components/DataTable/hooks/useServerSideDataEffect.ts
-import { useCallback as useCallback8, useEffect as useEffect12 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect12 } from "react";
 function useServerSideDataEffect({
   finalPaginationMode,
   serverSide,
@@ -5548,7 +5705,7 @@ function useServerSideDataEffect({
   fetchServerData,
   cleanup
 }) {
-  const handleServerSideChange = useCallback8(async () => {
+  const handleServerSideChange = useCallback9(async () => {
     if (finalPaginationMode !== "server" || !serverSide) {
       return;
     }
@@ -5615,7 +5772,7 @@ function useEffectiveColumnOrder({
 }
 
 // src/components/DataTable/hooks/useTableHandlers.ts
-import { useCallback as useCallback9, useMemo as useMemo10 } from "react";
+import { useCallback as useCallback10, useMemo as useMemo10 } from "react";
 function useTableHandlers({
   state,
   stateSnapshot,
@@ -5629,15 +5786,15 @@ function useTableHandlers({
   updateColumnOrder,
   onLayoutChange
 }) {
-  const handleSortingChange = useCallback9((updaterOrValue) => {
+  const handleSortingChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.sorting) : updaterOrValue;
     actions.setSorting(nextValue);
   }, [actions, stateSnapshot.sorting]);
-  const handleColumnFiltersChange = useCallback9((updaterOrValue) => {
+  const handleColumnFiltersChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.columnFilters) : updaterOrValue;
     actions.setColumnFilters(nextValue);
   }, [actions, stateSnapshot.columnFilters]);
-  const handleColumnVisibilityChange = useCallback9((updaterOrValue) => {
+  const handleColumnVisibilityChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.columnVisibility) : updaterOrValue;
     actions.setColumnVisibility(nextValue);
     if (canPersistVisibility) {
@@ -5648,7 +5805,7 @@ function useTableHandlers({
       columnVisibility: nextValue
     });
   }, [actions, stateSnapshot.columnVisibility, canPersistVisibility, updateSavedColumnVisibility, onLayoutChange, effectiveColumnOrder]);
-  const handleRowSelectionChange = useCallback9((updaterOrValue) => {
+  const handleRowSelectionChange = useCallback10((updaterOrValue) => {
     const currentSelection = selection ?? state.rowSelection;
     const nextSelection = typeof updaterOrValue === "function" ? updaterOrValue(currentSelection) : updaterOrValue;
     if (selection === void 0) {
@@ -5658,19 +5815,19 @@ function useTableHandlers({
     }
     onRowSelectionChange?.(nextSelection);
   }, [actions, selection, state.rowSelection, onRowSelectionChange]);
-  const handleGroupingChange = useCallback9((updaterOrValue) => {
+  const handleGroupingChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.grouping) : updaterOrValue;
     actions.setGrouping(nextValue);
   }, [actions, stateSnapshot.grouping]);
-  const handleExpandedChange = useCallback9((updaterOrValue) => {
+  const handleExpandedChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.expanded) : updaterOrValue;
     actions.setExpanded(nextValue);
   }, [actions, stateSnapshot.expanded]);
-  const handlePaginationChange = useCallback9((updaterOrValue) => {
+  const handlePaginationChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.pagination) : updaterOrValue;
     actions.setPagination(nextValue);
   }, [actions, stateSnapshot.pagination]);
-  const handleColumnOrderChange = useCallback9((updaterOrValue) => {
+  const handleColumnOrderChange = useCallback10((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.columnOrder) : updaterOrValue;
     const normalizedOrder = nextValue.includes("select") ? ["select", ...nextValue.filter((id) => id !== "select")] : nextValue;
     actions.setColumnOrder(normalizedOrder);
@@ -6040,7 +6197,7 @@ function AccessDeniedPage({
 }
 
 // src/components/DataTable/hooks/useDataTablePermissions.ts
-import { useMemo as useMemo12, useRef as useRef6, useState as useState9, useEffect as useEffect13 } from "react";
+import { useMemo as useMemo12, useRef as useRef7, useState as useState9, useEffect as useEffect13 } from "react";
 
 // src/components/DataTable/types.ts
 var defaultDataTableFeatures = {
@@ -6074,8 +6231,8 @@ function useDataTablePermissions(rbac, features = {}) {
   const user = authResult.user;
   const [isSuperAdminUser, setIsSuperAdminUser] = useState9(null);
   const [isCheckingSuperAdmin, setIsCheckingSuperAdmin] = useState9(() => !!user?.id);
-  const lastCheckedUserIdRef = useRef6(null);
-  const isCheckingRef = useRef6(false);
+  const lastCheckedUserIdRef = useRef7(null);
+  const isCheckingRef = useRef7(false);
   useEffect13(() => {
     if (lastCheckedUserIdRef.current === user?.id && isSuperAdminUser !== null) {
       return;
@@ -6138,7 +6295,7 @@ function useDataTablePermissions(rbac, features = {}) {
     selectedOrganisationId: selectedOrganisation?.id || null,
     selectedEventId: selectedEvent?.event_id || null
   });
-  const stableScopeRef = useRef6({
+  const stableScopeRef = useRef7({
     organisationId: void 0,
     appId: void 0,
     eventId: void 0
@@ -6520,7 +6677,7 @@ function useTableColumns({
 }
 
 // src/components/DataTable/hooks/useKeyboardNavigation.ts
-import { useCallback as useCallback10, useEffect as useEffect14, useRef as useRef7, useState as useState10 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect14, useRef as useRef8, useState as useState10 } from "react";
 function useKeyboardNavigation(rowCount, columnCount, options = {}) {
   const {
     enabled = true,
@@ -6535,11 +6692,11 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     focusedColumnIndex: 0,
     isNavigating: false
   });
-  const internalTableRef = useRef7(null);
+  const internalTableRef = useRef8(null);
   const tableRef = externalTableRef || internalTableRef;
-  const storedFocusRef = useRef7(null);
-  const navigationTimeoutRef = useRef7(void 0);
-  const getCellElement = useCallback10((rowIndex, columnIndex) => {
+  const storedFocusRef = useRef8(null);
+  const navigationTimeoutRef = useRef8(void 0);
+  const getCellElement = useCallback11((rowIndex, columnIndex) => {
     if (!tableRef.current) return null;
     const tbody = tableRef.current.querySelector("tbody");
     if (!tbody) return null;
@@ -6549,7 +6706,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     const cells = row.querySelectorAll('td[role="cell"], th[role="columnheader"]');
     return cells[columnIndex] || null;
   }, []);
-  const getHeaderElement = useCallback10((columnIndex) => {
+  const getHeaderElement = useCallback11((columnIndex) => {
     if (!tableRef.current) return null;
     const thead = tableRef.current.querySelector("thead");
     if (!thead) return null;
@@ -6558,7 +6715,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     const headers = headerRow.querySelectorAll('th[role="columnheader"]');
     return headers[columnIndex] || null;
   }, []);
-  const focusCell = useCallback10((rowIndex, columnIndex) => {
+  const focusCell = useCallback11((rowIndex, columnIndex) => {
     if (!enabled) return;
     const clampedRowIndex = Math.max(0, Math.min(rowIndex, rowCount - 1));
     const clampedColumnIndex = Math.max(0, Math.min(columnIndex, columnCount - 1));
@@ -6577,7 +6734,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
       announce(`Row ${clampedRowIndex + 1}, Column ${clampedColumnIndex + 1}`);
     }
   }, [enabled, rowCount, columnCount, getCellElement, onFocusChange, announceNavigation]);
-  const focusNext = useCallback10(() => {
+  const focusNext = useCallback11(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedColumnIndex < columnCount - 1) {
       focusCell(focusedRowIndex, focusedColumnIndex + 1);
@@ -6585,7 +6742,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
       focusCell(focusedRowIndex + 1, 0);
     }
   }, [state, columnCount, rowCount, focusCell]);
-  const focusPrevious = useCallback10(() => {
+  const focusPrevious = useCallback11(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedColumnIndex > 0) {
       focusCell(focusedRowIndex, focusedColumnIndex - 1);
@@ -6593,37 +6750,37 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
       focusCell(focusedRowIndex - 1, columnCount - 1);
     }
   }, [state, columnCount, focusCell]);
-  const focusUp = useCallback10(() => {
+  const focusUp = useCallback11(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedRowIndex > 0) {
       focusCell(focusedRowIndex - 1, focusedColumnIndex);
     }
   }, [state, focusCell]);
-  const focusDown = useCallback10(() => {
+  const focusDown = useCallback11(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedRowIndex < rowCount - 1) {
       focusCell(focusedRowIndex + 1, focusedColumnIndex);
     }
   }, [state, rowCount, focusCell]);
-  const focusRowStart = useCallback10(() => {
+  const focusRowStart = useCallback11(() => {
     const { focusedRowIndex } = state;
     focusCell(focusedRowIndex, 0);
   }, [state, focusCell]);
-  const focusRowEnd = useCallback10(() => {
+  const focusRowEnd = useCallback11(() => {
     const { focusedRowIndex } = state;
     focusCell(focusedRowIndex, columnCount - 1);
   }, [state, columnCount, focusCell]);
-  const focusTableStart = useCallback10(() => {
+  const focusTableStart = useCallback11(() => {
     focusCell(0, 0);
   }, [focusCell]);
-  const focusTableEnd = useCallback10(() => {
+  const focusTableEnd = useCallback11(() => {
     focusCell(rowCount - 1, columnCount - 1);
   }, [rowCount, columnCount, focusCell]);
-  const getCellTabIndex = useCallback10((rowIndex, columnIndex) => {
+  const getCellTabIndex = useCallback11((rowIndex, columnIndex) => {
     if (!enabled) return -1;
     return state.focusedRowIndex === rowIndex && state.focusedColumnIndex === columnIndex ? 0 : -1;
   }, [enabled, state.focusedRowIndex, state.focusedColumnIndex]);
-  const getCellKeyboardHandlers = useCallback10((rowIndex, columnIndex) => {
+  const getCellKeyboardHandlers = useCallback11((rowIndex, columnIndex) => {
     const onKeyDown = (event) => {
       if (!enabled) return;
       switch (event.key) {
@@ -6703,7 +6860,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     };
     return { onKeyDown, onFocus, onBlur };
   }, [enabled, focusNext, focusPrevious, focusUp, focusDown, focusRowStart, focusRowEnd, focusTableStart, focusTableEnd, onFocusChange]);
-  const getHeaderKeyboardHandlers = useCallback10((columnIndex, onSort) => {
+  const getHeaderKeyboardHandlers = useCallback11((columnIndex, onSort) => {
     const onKeyDown = (event) => {
       if (!enabled) return;
       switch (event.key) {
@@ -6761,20 +6918,20 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     };
     return { onKeyDown, onFocus };
   }, [enabled, getHeaderElement, columnCount, supportsColumnReorder, supportsColumnResize]);
-  const resetFocus = useCallback10(() => {
+  const resetFocus = useCallback11(() => {
     setState({
       focusedRowIndex: 0,
       focusedColumnIndex: 0,
       isNavigating: false
     });
   }, []);
-  const storeFocus = useCallback10(() => {
+  const storeFocus = useCallback11(() => {
     storedFocusRef.current = {
       rowIndex: state.focusedRowIndex,
       columnIndex: state.focusedColumnIndex
     };
   }, [state.focusedRowIndex, state.focusedColumnIndex]);
-  const restoreFocus = useCallback10(() => {
+  const restoreFocus = useCallback11(() => {
     if (storedFocusRef.current) {
       const { rowIndex, columnIndex } = storedFocusRef.current;
       focusCell(rowIndex, columnIndex);
@@ -6900,10 +7057,10 @@ function usePermissionTracking({
 }
 
 // src/components/DataTable/components/hooks/useImportModalFocus.ts
-import { useEffect as useEffect15, useRef as useRef8 } from "react";
+import { useEffect as useEffect15, useRef as useRef9 } from "react";
 function useImportModalFocus(isImportOpen, keyboardNavigation) {
-  const lastFocusedElementRef = useRef8(null);
-  const wasImportModalOpenRef = useRef8(false);
+  const lastFocusedElementRef = useRef9(null);
+  const wasImportModalOpenRef = useRef9(false);
   useEffect15(() => {
     if (isImportOpen) {
       wasImportModalOpenRef.current = true;
@@ -7061,11 +7218,11 @@ function DataTableInternal(props) {
     initializeLiveRegion();
   }, []);
   const rowSelection = selection !== void 0 ? selection : state.rowSelection;
-  const resolvedGetRowId = useCallback11(
+  const resolvedGetRowId = useCallback12(
     (row, index) => getRowIdSafe(row, index, getRowId),
     [getRowId]
   );
-  const hasInitializedExpansion = useRef9(false);
+  const hasInitializedExpansion = useRef10(false);
   useEffect16(() => {
     if (!hasInitializedExpansion.current && defaultGrouping && defaultGrouping.length > 0) {
       stateActions.setExpanded(true);
@@ -7215,7 +7372,7 @@ function DataTableInternal(props) {
     () => externalIsLoading || performanceLoading,
     [externalIsLoading, performanceLoading]
   );
-  const handleSearch = useCallback11((value) => {
+  const handleSearch = useCallback12((value) => {
     stateActions.setSearchQuery(value);
     setSearchQuery(value);
     if (secureFeatures.pagination) {
@@ -7693,9 +7850,8 @@ export {
   Dialog,
   DialogTrigger,
   DialogPortal,
-  DialogClose,
-  DialogOverlay,
   DialogContent,
+  DialogClose,
   DialogHeader,
   DialogBody,
   DialogFooter,
@@ -7790,4 +7946,4 @@ export {
   min,
   max
 };
-//# sourceMappingURL=chunk-7JPAB3T5.js.map
+//# sourceMappingURL=chunk-IVOFDYWT.js.map