@jmruthers/pace-core 0.5.93 → 0.5.94

package/dist/{chunk-TZXYSZT3.js → chunk-PRM6EYO3.js}

@@ -1,17 +1,17 @@
 import {
   useCan,
   useResolvedScope
-} from "./chunk-AZ2QJYKU.js";
+} from "./chunk-2KLAOD4M.js";
 import {
   toast,
   useDataTablePerformance
 } from "./chunk-QPCAGLUS.js";
 import {
   init_UnifiedAuthProvider
-} from "./chunk-AYC2P377.js";
+} from "./chunk-ORACUZ7H.js";
 import {
   useUnifiedAuth
-} from "./chunk-AAM57AEU.js";
+} from "./chunk-5RYPBJYL.js";
 import {
   cn
 } from "./chunk-PYUXFQJ3.js";
@@ -5502,10 +5502,10 @@ var require_lodash = __commonJS({
 });
 
 // src/components/DataTable/DataTable.tsx
-import React18 from "react";
+import React19 from "react";
 
 // src/components/DataTable/components/DataTableCore.tsx
-import React17, { useMemo as useMemo14, useCallback as useCallback10, useEffect as useEffect12, useRef as useRef7 } from "react";
+import React18, { useMemo as useMemo14, useCallback as useCallback11, useEffect as useEffect12, useRef as useRef7 } from "react";
 import { useReactTable } from "@tanstack/react-table";
 import { Edit, Trash, ChevronUp as ChevronUp2, ChevronDown as ChevronDown3, ChevronsUpDown } from "lucide-react";
 
@@ -5918,24 +5918,95 @@ var Select = React5.forwardRef(
     }, [ref]);
     const { state, actions } = useSelectState(selectProps);
     const { isSelecting } = useSelectEvents({ state, actions, selectRef });
+    const itemsMapRef = React5.useRef(/* @__PURE__ */ new Map());
+    const currentValueRef = React5.useRef(state.value);
     React5.useEffect(() => {
-      if (state.value && !state.selectedText) {
-        const selectElement = selectRef.current;
-        if (selectElement) {
-          const selectItem = selectElement.querySelector(`[data-value="${state.value}"]`);
-          if (selectItem) {
-            const textContent = selectItem.textContent?.trim() || "";
-            if (textContent) {
-              actions.setSelectedText(textContent);
-            }
-          }
+      currentValueRef.current = state.value;
+    }, [state.value]);
+    const updateSelectedTextIfNeeded = React5.useCallback((value) => {
+      if (value && value === currentValueRef.current) {
+        const registeredText = itemsMapRef.current.get(value);
+        if (registeredText) {
+          actions.setSelectedText(registeredText);
+          return true;
+        }
+      }
+      return false;
+    }, [actions.setSelectedText]);
+    const registerItem = React5.useCallback((value, text) => {
+      itemsMapRef.current.set(value, text);
+      updateSelectedTextIfNeeded(value);
+    }, [updateSelectedTextIfNeeded]);
+    const unregisterItem = React5.useCallback((value) => {
+      itemsMapRef.current.delete(value);
+    }, []);
+    const findAndSetSelectedText = React5.useCallback(() => {
+      if (!state.value) {
+        actions.setSelectedText("");
+        return;
+      }
+      const selectElement = selectRef.current;
+      if (!selectElement) return;
+      let selectItem = selectElement.querySelector(`[data-testid="select-item"][data-value="${state.value}"]`);
+      if (!selectItem) {
+        const hiddenContent = selectElement.querySelector('[data-testid="select-content-hidden"]');
+        if (hiddenContent) {
+          selectItem = hiddenContent.querySelector(`[data-testid="select-item"][data-value="${state.value}"]`);
+        }
+      }
+      if (!selectItem) {
+        const visibleContent = selectElement.querySelector('[data-testid="select-content"]');
+        if (visibleContent) {
+          selectItem = visibleContent.querySelector(`[data-testid="select-item"][data-value="${state.value}"]`);
+        }
+      }
+      if (selectItem) {
+        let textContent = selectItem.textContent?.trim() || "";
+        textContent = textContent.split("\n").map((line) => line.trim()).filter((line) => line).join(" ");
+        if (textContent) {
+          actions.setSelectedText(textContent);
+          itemsMapRef.current.set(state.value, textContent);
+          return;
         }
       }
-    }, [state.value, state.selectedText, actions, selectRef]);
+      const hasContentContainer = selectElement.querySelector('[data-testid="select-content-hidden"]') || selectElement.querySelector('[data-testid="select-content"]');
+      if (!hasContentContainer) {
+        actions.setSelectedText("");
+      }
+    }, [state.value, actions.setSelectedText, selectRef]);
+    React5.useLayoutEffect(() => {
+      findAndSetSelectedText();
+    }, [findAndSetSelectedText]);
+    React5.useEffect(() => {
+      if (state.value && !state.selectedText) {
+        const timeoutId = setTimeout(() => {
+          findAndSetSelectedText();
+        }, 0);
+        return () => clearTimeout(timeoutId);
+      }
+    }, [state.value, state.selectedText, findAndSetSelectedText]);
+    React5.useEffect(() => {
+      if (!state.value || state.selectedText) return;
+      const selectElement = selectRef.current;
+      if (!selectElement) return;
+      findAndSetSelectedText();
+      const observer = new MutationObserver(() => {
+        if (!state.selectedText) {
+          findAndSetSelectedText();
+        }
+      });
+      observer.observe(selectElement, {
+        childList: true,
+        subtree: true
+      });
+      return () => observer.disconnect();
+    }, [state.value, state.selectedText, findAndSetSelectedText, selectRef]);
     const contextValue = React5.useMemo(() => ({
       ...state,
-      actions
-    }), [state, actions]);
+      actions,
+      registerItem,
+      unregisterItem
+    }), [state, actions, registerItem, unregisterItem]);
     return /* @__PURE__ */ jsx4(
       "form",
       {
@@ -6092,7 +6163,16 @@ var SelectContent = React5.forwardRef(
       }
     }, [open, searchable]);
     if (!open) {
-      return null;
+      return /* @__PURE__ */ jsx4(
+        "ul",
+        {
+          ref,
+          style: { display: "none", visibility: "hidden", position: "absolute" },
+          "aria-hidden": "true",
+          "data-testid": "select-content-hidden",
+          children
+        }
+      );
     }
     return /* @__PURE__ */ jsxs2(
       "ul",
@@ -6157,7 +6237,7 @@ var SelectContent = React5.forwardRef(
 SelectContent.displayName = "SelectContent";
 var SelectItem = React5.forwardRef(
   ({ value, children, disabled = false, className, onClick }, ref) => {
-    const { value: selectedValue, actions } = useSelectContext();
+    const { value: selectedValue, actions, registerItem, unregisterItem } = useSelectContext();
     const isSelected = selectedValue === value;
     const getTextContent = (children2) => {
       if (typeof children2 === "string") return children2;
@@ -6171,6 +6251,16 @@ var SelectItem = React5.forwardRef(
       return "";
     };
     const itemText = getTextContent(children);
+    React5.useLayoutEffect(() => {
+      if (registerItem && itemText) {
+        registerItem(value, itemText);
+      }
+      return () => {
+        if (unregisterItem) {
+          unregisterItem(value);
+        }
+      };
+    }, [value, itemText, registerItem, unregisterItem]);
     const handleMouseDown = (e) => {
       if (!disabled) {
         const event = new CustomEvent("selectItemMouseDown", { detail: { value } });
@@ -6559,7 +6649,7 @@ function DataTableToolbar({
 }
 
 // src/components/DataTable/components/UnifiedTableBody.tsx
-import React8, { useRef as useRef3, useEffect as useEffect3 } from "react";
+import React9, { useRef as useRef3, useEffect as useEffect3 } from "react";
 import { flexRender as flexRender2 } from "@tanstack/react-table";
 import { useVirtualizer } from "@tanstack/react-virtual";
 import { ChevronDown as ChevronDown2, ChevronRight } from "lucide-react";
@@ -7018,9 +7108,11 @@ function ActionButtonsComponent({
 var ActionButtons = React7.memo(ActionButtonsComponent);
 
 // src/components/DataTable/components/EditableRow.tsx
+import React8 from "react";
 import { flexRender } from "@tanstack/react-table";
+import { X as X3, Check as Check3 } from "lucide-react";
 import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
-var renderEditField = (column, value, onChange, editingData = {}) => {
+var renderEditField = (column, value, onChange, editingData = {}, placeholder, inputRef) => {
   const columnDef = column.columnDef;
   if (columnDef.editable === false) {
     return /* @__PURE__ */ jsx13("span", { className: "text-sm text-gray-600", children: String(value ?? "") });
@@ -7044,6 +7136,7 @@ var renderEditField = (column, value, onChange, editingData = {}) => {
     return /* @__PURE__ */ jsx13(
       Input,
       {
+        ref: inputRef,
         type: "date",
         value: String(value ?? ""),
         onChange: (e) => onChange(e.target.value),
@@ -7055,6 +7148,7 @@ var renderEditField = (column, value, onChange, editingData = {}) => {
     return /* @__PURE__ */ jsx13(
       Input,
       {
+        ref: inputRef,
         type: "number",
         value: String(value ?? ""),
         onChange: (e) => onChange(e.target.value),
@@ -7065,11 +7159,12 @@ var renderEditField = (column, value, onChange, editingData = {}) => {
   return /* @__PURE__ */ jsx13(
     Input,
     {
+      ref: inputRef,
       type: "text",
       value: String(value ?? ""),
       onChange: (e) => onChange(e.target.value),
       className: "w-full h-7",
-      placeholder: `Enter ${column.id}`
+      placeholder: placeholder || `Enter ${column.id}`
     }
   );
 };
@@ -7085,6 +7180,14 @@ function EditableRow({
   hierarchical = false
 }) {
   const rowId = getRowId ? getRowId(row.original, row.index) : String(row.id);
+  const firstInputRef = React8.useRef(null);
+  const hasAssignedRef = React8.useRef(false);
+  React8.useEffect(() => {
+    if (firstInputRef.current) {
+      firstInputRef.current.focus();
+      firstInputRef.current.select();
+    }
+  }, []);
   return /* @__PURE__ */ jsxs9(
     "tr",
     {
@@ -7092,25 +7195,47 @@ function EditableRow({
       "aria-selected": typeof row.getIsSelected === "function" ? row.getIsSelected() ? "true" : "false" : "false",
       "aria-rowindex": row.index + 1,
       children: [
-        row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx13("td", { role: "cell", children: /* @__PURE__ */ jsx13("div", { className: cell.column.columnDef.meta?.align === "right" ? "text-right" : "", children: cell.column.id !== "actions" ? cell.column.columnDef.cell ? flexRender(cell.column.columnDef.cell, {
-          ...cell.getContext(),
-          getIsEditing: () => true,
-          setValue: (value) => {
-            if (typeof value === "object" && value !== null && !Array.isArray(value) && !(value instanceof Date)) {
-              onEditingDataChange({ ...editingData, ...value });
-            } else {
-              onEditingDataChange({ ...editingData, [cell.column.id]: value });
-            }
-          }
-        }) : renderEditField(cell.column, editingData[cell.column.id], (value) => {
-          if (typeof value === "object" && value !== null && !Array.isArray(value) && !(value instanceof Date)) {
-            onEditingDataChange({ ...editingData, ...value });
-          } else {
-            onEditingDataChange({ ...editingData, [cell.column.id]: value });
-          }
-        }, editingData) : /* @__PURE__ */ jsxs9("div", { className: "flex gap-1", children: [
-          /* @__PURE__ */ jsx13(Button, { onClick: onSave, size: "sm", variant: "default", children: "Save" }),
-          /* @__PURE__ */ jsx13(Button, { onClick: onCancel, size: "sm", variant: "outline", children: "Cancel" })
+        row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx13("td", { role: "cell", children: /* @__PURE__ */ jsx13("div", { className: cell.column.columnDef.meta?.align === "right" ? "text-right" : "", children: cell.column.id !== "actions" ? (
+          // In edit mode, always use renderEditField for editable columns
+          // Custom cell renderers are for display mode only
+          (() => {
+            const columnDef = cell.column.columnDef;
+            if (columnDef.editable === false) {
+              return cell.column.columnDef.cell ? flexRender(cell.column.columnDef.cell, {
+                ...cell.getContext(),
+                getIsEditing: () => true,
+                setValue: (value) => {
+                  if (typeof value === "object" && value !== null && !Array.isArray(value) && !(value instanceof Date)) {
+                    onEditingDataChange({ ...editingData, ...value });
+                  } else {
+                    onEditingDataChange({ ...editingData, [cell.column.id]: value });
+                  }
+                }
+              }) : /* @__PURE__ */ jsx13("span", { className: "text-sm text-gray-600", children: String(cell.getValue() ?? "") });
+            }
+            const shouldGetRef = !hasAssignedRef.current;
+            if (shouldGetRef) {
+              hasAssignedRef.current = true;
+            }
+            return renderEditField(
+              cell.column,
+              editingData[cell.column.id] ?? cell.getValue(),
+              (value) => {
+                if (typeof value === "object" && value !== null && !Array.isArray(value) && !(value instanceof Date)) {
+                  onEditingDataChange({ ...editingData, ...value });
+                } else {
+                  onEditingDataChange({ ...editingData, [cell.column.id]: value });
+                }
+              },
+              editingData,
+              void 0,
+              // placeholder
+              shouldGetRef ? firstInputRef : void 0
+            );
+          })()
+        ) : /* @__PURE__ */ jsxs9("div", { className: "flex gap-1", children: [
+          /* @__PURE__ */ jsx13(Button, { onClick: onSave, size: "sm", variant: "default", "aria-label": "Save changes", children: /* @__PURE__ */ jsx13(Check3, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ jsx13(Button, { onClick: onCancel, size: "sm", variant: "outline", "aria-label": "Cancel editing", children: /* @__PURE__ */ jsx13(X3, { className: "h-4 w-4" }) })
         ] }) }) }, cell.id)),
         actions.length > 0 && /* @__PURE__ */ jsx13("td", { children: /* @__PURE__ */ jsx13(
           ActionButtons,
@@ -7386,7 +7511,7 @@ var renderEditField2 = (column, value, onChange, editingData = {}, placeholder)
     }
   );
 };
-var RowComponent = React8.memo(({
+var RowComponent = React9.memo(({
   row,
   style,
   isEditing,
@@ -7441,101 +7566,34 @@ var RowComponent = React8.memo(({
     const groupValue = row.getValue(grouping[0]);
     const subRowsCount = row.subRows?.length || 0;
     const isExpanded = row.getIsExpanded();
-    return /* @__PURE__ */ jsxs10(React8.Fragment, { children: [
-      /* @__PURE__ */ jsx14("tr", { className: "bg-sec-50 hover:bg-sec-100", style, children: /* @__PURE__ */ jsxs10(
-        "td",
-        {
-          className: getTableCellClasses({
-            isCompact: true,
-            className: "px-3 py-2 flex items-center font-medium"
-          }),
-          colSpan: row.getAllCells().length,
-          children: [
-            /* @__PURE__ */ jsx14(
-              Button,
-              {
-                variant: "ghost",
-                size: "sm",
-                onClick: () => row.toggleExpanded(),
-                className: "p-0 h-auto mr-2",
-                children: isExpanded ? /* @__PURE__ */ jsx14(ChevronDown2, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx14(ChevronRight, { className: "h-4 w-4" })
-              }
-            ),
-            /* @__PURE__ */ jsxs10("span", { className: "text-sm", children: [
-              String(groupValue),
-              " (",
-              subRowsCount,
-              " items)"
-            ] })
-          ]
-        }
-      ) }),
-      isExpanded && row.subRows?.map((subRow) => {
-        const subRowId = getRowId ? getRowId(subRow.original, subRow.index) : String(subRow.index);
-        const isSubRowEditing = editingRowId === subRowId;
-        return /* @__PURE__ */ jsx14("tr", { className: "border-l-2 border-l-blue-200", style, children: subRow.getVisibleCells().map((cell) => /* @__PURE__ */ jsx14(
-          "td",
-          {
-            className: getTableCellClasses({
-              isCompact: true,
-              className: `px-3 py-2 pl-8 ${cell.column.id === "actions" ? "whitespace-nowrap" : "whitespace-normal break-words"} ${cell.column.columnDef.meta?.align === "right" ? "text-right" : ""}`
-            }),
-            children: isSubRowEditing && cell.column.id !== "actions" ? (
-              // Check if column has a custom cell renderer - if so, use it in edit mode
-              cell.column.columnDef.cell ? flexRender2(cell.column.columnDef.cell, {
-                ...cell.getContext(),
-                hierarchical,
-                isParent: false,
-                isChild: true,
-                isHierarchical: false,
-                rowId: subRowId,
-                isExpanded: false,
-                hasChildren: false,
-                getIsEditing: () => true,
-                // Always true in edit mode
-                setValue: (value) => {
-                  if (typeof value === "object" && value !== null) {
-                    onEditingDataChange?.({ ...editingData, ...value });
-                  } else {
-                    onEditingDataChange?.({ ...editingData, [cell.column.id]: value });
-                  }
-                }
-              }) : (
-                // Fall back to default edit field rendering when no custom cell renderer
-                renderEditField2(cell.column, editingData?.[cell.column.id], (value) => {
-                  if (typeof value === "object" && value !== null) {
-                    onEditingDataChange?.({ ...editingData, ...value });
-                  } else {
-                    onEditingDataChange?.({ ...editingData, [cell.column.id]: value });
-                  }
-                }, editingData)
-              )
-            ) : cell.column.id === "actions" ? /* @__PURE__ */ jsx14(
-              ActionButtons,
-              {
-                row,
-                actions,
-                isEditing,
-                isParent,
-                hierarchical: !!hierarchical,
-                rbac,
-                permissions
-              }
-            ) : flexRender2(cell.column.columnDef.cell, {
-              ...cell.getContext(),
-              hierarchical,
-              isParent: false,
-              isChild: true,
-              isHierarchical: false,
-              rowId: subRowId,
-              isExpanded: false,
-              hasChildren: false
-            })
-          },
-          cell.id
-        )) }, subRow.id);
-      })
-    ] });
+    return /* @__PURE__ */ jsx14("tr", { className: "bg-sec-50 hover:bg-sec-100", style, children: /* @__PURE__ */ jsxs10(
+      "td",
+      {
+        className: getTableCellClasses({
+          isCompact: true,
+          className: "px-3 py-2 flex items-center font-medium"
+        }),
+        colSpan: row.getAllCells().length,
+        children: [
+          /* @__PURE__ */ jsx14(
+            Button,
+            {
+              variant: "ghost",
+              size: "sm",
+              onClick: () => row.toggleExpanded(),
+              className: "p-0 h-auto mr-2",
+              children: isExpanded ? /* @__PURE__ */ jsx14(ChevronDown2, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx14(ChevronRight, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsxs10("span", { className: "text-sm", children: [
+            String(groupValue),
+            " (",
+            subRowsCount,
+            " items)"
+          ] })
+        ]
+      }
+    ) });
   }
   if (isEditing && editingData && onEditingDataChange && onSaveEditing && onCancelEditing) {
     return /* @__PURE__ */ jsx14(
@@ -7880,7 +7938,7 @@ function UnifiedTableBody({
 }
 
 // src/components/DataTable/components/PaginationControls.tsx
-import React9 from "react";
+import React10 from "react";
 import {
   ChevronLeft,
   ChevronRight as ChevronRight2,
@@ -8203,7 +8261,7 @@ function EnhancedPaginationControls({
   showJumpToPage = false,
   ...props
 }) {
-  const [jumpToPage, setJumpToPage] = React9.useState("");
+  const [jumpToPage, setJumpToPage] = React10.useState("");
   const { table, paginationMode = "client", serverData, onPageChange, totalCount } = props;
   const pagination = getPaginationBinding({
     mode: paginationMode,
@@ -8260,9 +8318,9 @@ import { useEffect as useEffect6 } from "react";
 import { useState as useState4, useRef as useRef4, useEffect as useEffect5 } from "react";
 
 // src/components/Dialog/Dialog.tsx
-import * as React10 from "react";
+import * as React11 from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { X as X3 } from "lucide-react";
+import { X as X4 } from "lucide-react";
 
 // src/components/Dialog/utils/safeHtml.ts
 function sanitizeHtml(html) {
@@ -8336,7 +8394,7 @@ var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = DialogPrimitive.Portal;
 var DialogClose = DialogPrimitive.Close;
-var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
+var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -8413,7 +8471,7 @@ var useSmartDimensions = ({
   }
   return result;
 };
-var DialogContent = React10.forwardRef(({
+var DialogContent = React11.forwardRef(({
   className,
   children,
   size = "md",
@@ -8440,17 +8498,17 @@ var DialogContent = React10.forwardRef(({
     minWidth,
     enableScrolling
   });
-  const handleEscapeKeyDown = React10.useCallback((event) => {
+  const handleEscapeKeyDown = React11.useCallback((event) => {
     if (preventCloseOnEscape) {
       event.preventDefault();
     }
   }, [preventCloseOnEscape]);
-  const handlePointerDownOutside = React10.useCallback((event) => {
+  const handlePointerDownOutside = React11.useCallback((event) => {
     if (preventCloseOnOutsideClick) {
       event.preventDefault();
     }
   }, [preventCloseOnOutsideClick]);
-  const mergedStyle = React10.useMemo(() => {
+  const mergedStyle = React11.useMemo(() => {
     if (Object.keys(smartDimensions).length === 0) {
       return style;
     }
@@ -8492,7 +8550,7 @@ var DialogContent = React10.forwardRef(({
         children: [
           children,
           showCloseButton && /* @__PURE__ */ jsxs13(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__ */ jsx17(X3, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsx17(X4, { className: "h-4 w-4" }),
             /* @__PURE__ */ jsx17("span", { className: "sr-only", children: "Close" })
           ] })
         ]
@@ -8528,13 +8586,13 @@ var DialogBody = ({
   children,
   ...props
 }) => {
-  const mergedStyle = React10.useMemo(() => {
+  const mergedStyle = React11.useMemo(() => {
     return {
       ...maxHeight && { maxHeight },
       ...style
     };
   }, [maxHeight, style]);
-  const processedHtmlContent = React10.useMemo(() => {
+  const processedHtmlContent = React11.useMemo(() => {
     if (!htmlContent || !allowHtml) {
       return null;
     }
@@ -8596,8 +8654,8 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React10.forwardRef(({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
-  const processedHtmlContent = React10.useMemo(() => {
+var DialogTitle = React11.forwardRef(({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
+  const processedHtmlContent = React11.useMemo(() => {
     if (!htmlContent || !allowHtml) {
       return null;
     }
@@ -8621,8 +8679,8 @@ var DialogTitle = React10.forwardRef(({ className, htmlContent, allowHtml = true
   );
 });
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React10.forwardRef(({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
-  const processedHtmlContent = React10.useMemo(() => {
+var DialogDescription = React11.forwardRef(({ className, htmlContent, allowHtml = true, children, ...props }, ref) => {
+  const processedHtmlContent = React11.useMemo(() => {
     if (!htmlContent || !allowHtml) {
       return null;
     }
@@ -8886,12 +8944,12 @@ function DataTableModals({
 }
 
 // src/components/DataTable/components/DataTableErrorBoundary.tsx
-import React14, { Component } from "react";
+import React15, { Component } from "react";
 
 // src/components/Alert/Alert.tsx
-import * as React13 from "react";
+import * as React14 from "react";
 import { jsx as jsx20 } from "react/jsx-runtime";
-var AlertContext = React13.createContext({ variant: "default" });
+var AlertContext = React14.createContext({ variant: "default" });
 var getAlertClasses = (variant = "default") => {
   const baseClasses = "relative w-full rounded-lg border p-4";
   const variantClasses = {
@@ -8902,10 +8960,10 @@ var getAlertClasses = (variant = "default") => {
   };
   return `${baseClasses} ${variantClasses[variant]}`;
 };
-var Alert = React13.forwardRef(({ className, variant = "default", ...props }, ref) => {
-  const contextValue = React13.useMemo(() => ({ variant }), [variant]);
+var Alert = React14.forwardRef(({ className, variant = "default", ...props }, ref) => {
+  const contextValue = React14.useMemo(() => ({ variant }), [variant]);
   if (variant === "inline") {
-    return /* @__PURE__ */ jsx20(AlertContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx20(React13.Fragment, { ...props }) });
+    return /* @__PURE__ */ jsx20(AlertContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx20(React14.Fragment, { ...props }) });
   }
   return /* @__PURE__ */ jsx20(AlertContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx20(
     "div",
@@ -8918,8 +8976,8 @@ var Alert = React13.forwardRef(({ className, variant = "default", ...props }, re
   ) });
 });
 Alert.displayName = "Alert";
-var AlertTitle = React13.forwardRef(({ className, ...props }, ref) => {
-  const { variant } = React13.useContext(AlertContext);
+var AlertTitle = React14.forwardRef(({ className, ...props }, ref) => {
+  const { variant } = React14.useContext(AlertContext);
   if (variant === "inline") {
     return /* @__PURE__ */ jsx20("strong", { ...props });
   }
@@ -8933,8 +8991,8 @@ var AlertTitle = React13.forwardRef(({ className, ...props }, ref) => {
   );
 });
 AlertTitle.displayName = "AlertTitle";
-var AlertDescription = React13.forwardRef(({ className, ...props }, ref) => {
-  const { variant } = React13.useContext(AlertContext);
+var AlertDescription = React14.forwardRef(({ className, ...props }, ref) => {
+  const { variant } = React14.useContext(AlertContext);
   if (variant === "inline") {
     return /* @__PURE__ */ jsx20("span", { ...props });
   }
@@ -9069,7 +9127,7 @@ var DataTableErrorBoundary = class extends Component {
 };
 
 // src/components/DataTable/hooks/useColumnOrderPersistence.ts
-import { useState as useState5, useEffect as useEffect7, useCallback as useCallback3 } from "react";
+import { useState as useState5, useEffect as useEffect7, useCallback as useCallback4 } from "react";
 function useColumnOrderPersistence({
   tableId,
   defaultOrder = [],
@@ -9103,7 +9161,7 @@ function useColumnOrderPersistence({
       setIsLoaded(true);
     }
   }, [enablePersistence, finalStorageKey, storageKey, tableId]);
-  const saveColumnOrder = useCallback3((newOrder) => {
+  const saveColumnOrder = useCallback4((newOrder) => {
     if (!enablePersistence || typeof window === "undefined") return;
     if (!storageKey && !tableId) return;
     try {
@@ -9112,11 +9170,11 @@ function useColumnOrderPersistence({
       logger.warn("Failed to save column order to localStorage:", error);
     }
   }, [enablePersistence, finalStorageKey, storageKey, tableId]);
-  const updateColumnOrder = useCallback3((newOrder) => {
+  const updateColumnOrder = useCallback4((newOrder) => {
     setColumnOrder(newOrder);
     saveColumnOrder(newOrder);
   }, [saveColumnOrder]);
-  const resetColumnOrder = useCallback3(() => {
+  const resetColumnOrder = useCallback4(() => {
     setColumnOrder(defaultOrder);
     if (enablePersistence && (storageKey || tableId) && typeof window !== "undefined") {
       try {
@@ -9126,7 +9184,7 @@ function useColumnOrderPersistence({
       }
     }
   }, [defaultOrder, enablePersistence, finalStorageKey, storageKey, tableId]);
-  const clearAllPreferences = useCallback3(() => {
+  const clearAllPreferences = useCallback4(() => {
     if (!enablePersistence || typeof window === "undefined") return;
     try {
       const keys = Object.keys(localStorage);
@@ -9149,7 +9207,7 @@ function useColumnOrderPersistence({
 }
 
 // src/components/DataTable/hooks/useColumnVisibilityPersistence.ts
-import { useState as useState6, useEffect as useEffect8, useCallback as useCallback4 } from "react";
+import { useState as useState6, useEffect as useEffect8, useCallback as useCallback5 } from "react";
 function useColumnVisibilityPersistence({
   tableId,
   defaultVisibility = {},
@@ -9179,7 +9237,7 @@ function useColumnVisibilityPersistence({
       setIsLoaded(true);
     }
   }, [enablePersistence, finalStorageKey]);
-  const saveColumnVisibility = useCallback4((newVisibility) => {
+  const saveColumnVisibility = useCallback5((newVisibility) => {
     if (!enablePersistence || typeof window === "undefined") return;
     try {
       localStorage.setItem(finalStorageKey, JSON.stringify(newVisibility));
@@ -9187,11 +9245,11 @@ function useColumnVisibilityPersistence({
       logger.warn("Failed to save column visibility to localStorage:", error);
     }
   }, [enablePersistence, finalStorageKey]);
-  const updateColumnVisibility = useCallback4((newVisibility) => {
+  const updateColumnVisibility = useCallback5((newVisibility) => {
     setColumnVisibility(newVisibility);
     saveColumnVisibility(newVisibility);
   }, [saveColumnVisibility]);
-  const resetColumnVisibility = useCallback4(() => {
+  const resetColumnVisibility = useCallback5(() => {
     setColumnVisibility(defaultVisibility);
     if (enablePersistence && typeof window !== "undefined") {
       try {
@@ -9201,7 +9259,7 @@ function useColumnVisibilityPersistence({
       }
     }
   }, [defaultVisibility, enablePersistence, finalStorageKey]);
-  const clearAllPreferences = useCallback4(() => {
+  const clearAllPreferences = useCallback5(() => {
     if (!enablePersistence || typeof window === "undefined") return;
     try {
       const keys = Object.keys(localStorage);
@@ -9224,7 +9282,7 @@ function useColumnVisibilityPersistence({
 }
 
 // src/components/DataTable/hooks/useDataTableState.ts
-import { useReducer, useCallback as useCallback5, useMemo as useMemo6 } from "react";
+import { useReducer, useCallback as useCallback6, useMemo as useMemo6 } from "react";
 function dataTableReducer(state, action) {
   switch (action.type) {
     case "SET_SORTING":
@@ -9360,7 +9418,7 @@ function useDataTableState({
     hasFilters: state.columnFilters.length > 0 || state.searchQuery !== "",
     canClearFilters: state.columnFilters.length > 0 || state.searchQuery !== ""
   }), [state]);
-  const clearFilters = useCallback5(() => {
+  const clearFilters = useCallback6(() => {
     dispatch({ type: "SET_COLUMN_FILTERS", payload: [] });
     dispatch({ type: "SET_SEARCH_QUERY", payload: "" });
   }, []);
@@ -9376,7 +9434,7 @@ function useDataTableState({
 import { useMemo as useMemo8 } from "react";
 
 // src/components/DataTable/hooks/useHierarchicalState.ts
-import { useState as useState7, useCallback as useCallback6, useMemo as useMemo7, useEffect as useEffect9 } from "react";
+import { useState as useState7, useCallback as useCallback7, useMemo as useMemo7, useEffect as useEffect9 } from "react";
 function useHierarchicalState(data, config) {
   const initialExpandedState = useMemo7(() => {
     if (!config?.defaultExpanded) {
@@ -9438,7 +9496,7 @@ function useHierarchicalState(data, config) {
     }
     return visible;
   }, [data, expandedRows, parentChildMap]);
-  const toggleRow = useCallback6((rowId) => {
+  const toggleRow = useCallback7((rowId) => {
     setExpandedRows((prev) => {
       const newSet = new Set(prev);
       if (newSet.has(rowId)) {
@@ -9452,32 +9510,32 @@ function useHierarchicalState(data, config) {
       return newSet;
     });
   }, [config]);
-  const expandAll = useCallback6(() => {
+  const expandAll = useCallback7(() => {
     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 = useCallback6(() => {
+  const collapseAll = useCallback7(() => {
     setExpandedRows(/* @__PURE__ */ new Set());
     if (config?.onExpandedChange) {
       config.onExpandedChange([]);
     }
   }, [config]);
-  const isExpanded = useCallback6((rowId) => {
+  const isExpanded = useCallback7((rowId) => {
     return expandedRows.has(rowId);
   }, [expandedRows]);
-  const hasChildren = useCallback6((rowId) => {
+  const hasChildren = useCallback7((rowId) => {
     return parentChildMap.has(rowId) && (parentChildMap.get(rowId)?.length || 0) > 0;
   }, [parentChildMap]);
-  const getChildrenCount = useCallback6((rowId) => {
+  const getChildrenCount = useCallback7((rowId) => {
     return parentChildMap.get(rowId)?.length || 0;
   }, [parentChildMap]);
-  const getExpandedIds = useCallback6(() => {
+  const getExpandedIds = useCallback7(() => {
     return Array.from(expandedRows);
   }, [expandedRows]);
-  const setExpandedIds = useCallback6((ids) => {
+  const setExpandedIds = useCallback7((ids) => {
     setExpandedRows(new Set(ids));
   }, []);
   return {
@@ -9658,7 +9716,7 @@ function useDataTableDataPipeline({
 }
 
 // src/components/DataTable/hooks/useServerSideDataEffect.ts
-import { useCallback as useCallback7, useEffect as useEffect10 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect10 } from "react";
 function useServerSideDataEffect({
   finalPaginationMode,
   serverSide,
@@ -9671,7 +9729,7 @@ function useServerSideDataEffect({
   fetchServerData,
   cleanup
 }) {
-  const handleServerSideChange = useCallback7(async () => {
+  const handleServerSideChange = useCallback8(async () => {
     if (finalPaginationMode !== "server" || !serverSide) {
       return;
     }
@@ -9738,7 +9796,7 @@ function useEffectiveColumnOrder({
 }
 
 // src/components/DataTable/hooks/useTableHandlers.ts
-import { useCallback as useCallback8, useMemo as useMemo10 } from "react";
+import { useCallback as useCallback9, useMemo as useMemo10 } from "react";
 function useTableHandlers({
   state,
   stateSnapshot,
@@ -9752,15 +9810,15 @@ function useTableHandlers({
   updateColumnOrder,
   onLayoutChange
 }) {
-  const handleSortingChange = useCallback8((updaterOrValue) => {
+  const handleSortingChange = useCallback9((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.sorting) : updaterOrValue;
     actions.setSorting(nextValue);
   }, [actions, stateSnapshot.sorting]);
-  const handleColumnFiltersChange = useCallback8((updaterOrValue) => {
+  const handleColumnFiltersChange = useCallback9((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.columnFilters) : updaterOrValue;
     actions.setColumnFilters(nextValue);
   }, [actions, stateSnapshot.columnFilters]);
-  const handleColumnVisibilityChange = useCallback8((updaterOrValue) => {
+  const handleColumnVisibilityChange = useCallback9((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.columnVisibility) : updaterOrValue;
     actions.setColumnVisibility(nextValue);
     if (canPersistVisibility) {
@@ -9771,7 +9829,7 @@ function useTableHandlers({
       columnVisibility: nextValue
     });
   }, [actions, stateSnapshot.columnVisibility, canPersistVisibility, updateSavedColumnVisibility, onLayoutChange, effectiveColumnOrder]);
-  const handleRowSelectionChange = useCallback8((updaterOrValue) => {
+  const handleRowSelectionChange = useCallback9((updaterOrValue) => {
     const currentSelection = selection ?? state.rowSelection;
     const nextSelection = typeof updaterOrValue === "function" ? updaterOrValue(currentSelection) : updaterOrValue;
     if (selection === void 0) {
@@ -9780,19 +9838,19 @@ function useTableHandlers({
     }
     onRowSelectionChange?.(nextSelection);
   }, [actions, selection, state.rowSelection, onRowSelectionChange]);
-  const handleGroupingChange = useCallback8((updaterOrValue) => {
+  const handleGroupingChange = useCallback9((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.grouping) : updaterOrValue;
     actions.setGrouping(nextValue);
   }, [actions, stateSnapshot.grouping]);
-  const handleExpandedChange = useCallback8((updaterOrValue) => {
+  const handleExpandedChange = useCallback9((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.expanded) : updaterOrValue;
     actions.setExpanded(nextValue);
   }, [actions, stateSnapshot.expanded]);
-  const handlePaginationChange = useCallback8((updaterOrValue) => {
+  const handlePaginationChange = useCallback9((updaterOrValue) => {
     const nextValue = typeof updaterOrValue === "function" ? updaterOrValue(stateSnapshot.pagination) : updaterOrValue;
     actions.setPagination(nextValue);
   }, [actions, stateSnapshot.pagination]);
-  const handleColumnOrderChange = useCallback8((updaterOrValue) => {
+  const handleColumnOrderChange = useCallback9((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);
@@ -9908,7 +9966,7 @@ function useDataTableConfiguration({
 }
 
 // src/components/Card/Card.tsx
-import * as React15 from "react";
+import * as React16 from "react";
 import { jsx as jsx22 } from "react/jsx-runtime";
 function getCardClasses(variant = "default", size = "default") {
   const baseClasses = "rounded-lg border bg-card text-card-foreground shadow-sm";
@@ -9924,7 +9982,7 @@ function getCardClasses(variant = "default", size = "default") {
   };
   return `${baseClasses} ${variantClasses[variant]} ${sizeClasses2[size]}`;
 }
-var Card = React15.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsx22(
+var Card = React16.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsx22(
   "article",
   {
     ref,
@@ -9937,7 +9995,7 @@ var Card = React15.forwardRef(({ className, variant, size, ...props }, ref) => /
   }
 ));
 Card.displayName = "Card";
-var CardHeader = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var CardHeader = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "header",
   {
     ref,
@@ -9946,7 +10004,7 @@ var CardHeader = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var CardTitle = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "h3",
   {
     ref,
@@ -9958,7 +10016,7 @@ var CardTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var CardDescription = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "p",
   {
     ref,
@@ -9967,7 +10025,7 @@ var CardDescription = React15.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var CardContent = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "main",
   {
     ref,
@@ -9976,7 +10034,7 @@ var CardContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CardContent.displayName = "CardContent";
-var CardFooter = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var CardFooter = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "footer",
   {
     ref,
@@ -9985,7 +10043,7 @@ var CardFooter = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardFooter.displayName = "CardFooter";
-var CardActions = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var CardActions = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "nav",
   {
     ref,
@@ -9996,7 +10054,7 @@ var CardActions = React15.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CardActions.displayName = "CardActions";
-var HoverCard = React15.forwardRef(({ children, className, ...props }, ref) => {
+var HoverCard = React16.forwardRef(({ children, className, ...props }, ref) => {
   return /* @__PURE__ */ jsx22(
     "section",
     {
@@ -10008,7 +10066,7 @@ var HoverCard = React15.forwardRef(({ children, className, ...props }, ref) => {
   );
 });
 HoverCard.displayName = "HoverCard";
-var HoverCardTrigger = React15.forwardRef(({ className, asChild, children, ...props }, ref) => {
+var HoverCardTrigger = React16.forwardRef(({ className, asChild, children, ...props }, ref) => {
   if (asChild) {
     return /* @__PURE__ */ jsx22("span", { className: cn("cursor-pointer", className), children });
   }
@@ -10027,7 +10085,7 @@ var HoverCardTrigger = React15.forwardRef(({ className, asChild, children, ...pr
   );
 });
 HoverCardTrigger.displayName = "HoverCardTrigger";
-var HoverCardContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var HoverCardContent = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
   "aside",
   {
     ref,
@@ -10333,7 +10391,7 @@ function useDataTablePermissions(rbac, features = {}) {
 }
 
 // src/components/DataTable/hooks/useTableColumns.ts
-import React16, { useMemo as useMemo13 } from "react";
+import React17, { useMemo as useMemo13 } from "react";
 
 // src/components/DataTable/core/ColumnFactory.ts
 var ColumnFactory = class {
@@ -10526,14 +10584,14 @@ function useTableColumns({
       header: ({ table }) => {
         const isAllSelected = table.getIsAllPageRowsSelected();
         const isSomeSelected = table.getIsSomePageRowsSelected();
-        return React16.createElement(Checkbox, {
+        return React17.createElement(Checkbox, {
           checked: isAllSelected ? true : isSomeSelected ? "indeterminate" : false,
           onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value),
           "aria-label": "Select all"
         });
       },
       cell: ({ row }) => {
-        return React16.createElement(Checkbox, {
+        return React17.createElement(Checkbox, {
           checked: row.getIsSelected(),
           onCheckedChange: (value) => row.toggleSelected(!!value),
           "aria-label": "Select row"
@@ -10722,7 +10780,7 @@ function getRowDescription(rowIndex, totalRows, isSelected = false, isEditing =
 }
 
 // src/components/DataTable/hooks/useKeyboardNavigation.ts
-import { useCallback as useCallback9, useEffect as useEffect11, useRef as useRef6, useState as useState8 } from "react";
+import { useCallback as useCallback10, useEffect as useEffect11, useRef as useRef6, useState as useState8 } from "react";
 function useKeyboardNavigation(rowCount, columnCount, options = {}) {
   const {
     enabled = true,
@@ -10741,7 +10799,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
   const tableRef = externalTableRef || internalTableRef;
   const storedFocusRef = useRef6(null);
   const navigationTimeoutRef = useRef6();
-  const getCellElement = useCallback9((rowIndex, columnIndex) => {
+  const getCellElement = useCallback10((rowIndex, columnIndex) => {
     if (!tableRef.current) return null;
     const tbody = tableRef.current.querySelector("tbody");
     if (!tbody) return null;
@@ -10751,7 +10809,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     const cells = row.querySelectorAll('td[role="cell"], th[role="columnheader"]');
     return cells[columnIndex] || null;
   }, []);
-  const getHeaderElement = useCallback9((columnIndex) => {
+  const getHeaderElement = useCallback10((columnIndex) => {
     if (!tableRef.current) return null;
     const thead = tableRef.current.querySelector("thead");
     if (!thead) return null;
@@ -10760,7 +10818,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     const headers = headerRow.querySelectorAll('th[role="columnheader"]');
     return headers[columnIndex] || null;
   }, []);
-  const focusCell = useCallback9((rowIndex, columnIndex) => {
+  const focusCell = useCallback10((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));
@@ -10779,7 +10837,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
       announce(`Row ${clampedRowIndex + 1}, Column ${clampedColumnIndex + 1}`);
     }
   }, [enabled, rowCount, columnCount, getCellElement, onFocusChange, announceNavigation]);
-  const focusNext = useCallback9(() => {
+  const focusNext = useCallback10(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedColumnIndex < columnCount - 1) {
       focusCell(focusedRowIndex, focusedColumnIndex + 1);
@@ -10787,7 +10845,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
       focusCell(focusedRowIndex + 1, 0);
     }
   }, [state, columnCount, rowCount, focusCell]);
-  const focusPrevious = useCallback9(() => {
+  const focusPrevious = useCallback10(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedColumnIndex > 0) {
       focusCell(focusedRowIndex, focusedColumnIndex - 1);
@@ -10795,37 +10853,37 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
       focusCell(focusedRowIndex - 1, columnCount - 1);
     }
   }, [state, columnCount, focusCell]);
-  const focusUp = useCallback9(() => {
+  const focusUp = useCallback10(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedRowIndex > 0) {
       focusCell(focusedRowIndex - 1, focusedColumnIndex);
     }
   }, [state, focusCell]);
-  const focusDown = useCallback9(() => {
+  const focusDown = useCallback10(() => {
     const { focusedRowIndex, focusedColumnIndex } = state;
     if (focusedRowIndex < rowCount - 1) {
       focusCell(focusedRowIndex + 1, focusedColumnIndex);
     }
   }, [state, rowCount, focusCell]);
-  const focusRowStart = useCallback9(() => {
+  const focusRowStart = useCallback10(() => {
     const { focusedRowIndex } = state;
     focusCell(focusedRowIndex, 0);
   }, [state, focusCell]);
-  const focusRowEnd = useCallback9(() => {
+  const focusRowEnd = useCallback10(() => {
     const { focusedRowIndex } = state;
     focusCell(focusedRowIndex, columnCount - 1);
   }, [state, columnCount, focusCell]);
-  const focusTableStart = useCallback9(() => {
+  const focusTableStart = useCallback10(() => {
     focusCell(0, 0);
   }, [focusCell]);
-  const focusTableEnd = useCallback9(() => {
+  const focusTableEnd = useCallback10(() => {
     focusCell(rowCount - 1, columnCount - 1);
   }, [rowCount, columnCount, focusCell]);
-  const getCellTabIndex = useCallback9((rowIndex, columnIndex) => {
+  const getCellTabIndex = useCallback10((rowIndex, columnIndex) => {
     if (!enabled) return -1;
     return state.focusedRowIndex === rowIndex && state.focusedColumnIndex === columnIndex ? 0 : -1;
   }, [enabled, state.focusedRowIndex, state.focusedColumnIndex]);
-  const getCellKeyboardHandlers = useCallback9((rowIndex, columnIndex) => {
+  const getCellKeyboardHandlers = useCallback10((rowIndex, columnIndex) => {
     const onKeyDown = (event) => {
       if (!enabled) return;
       switch (event.key) {
@@ -10905,7 +10963,7 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     };
     return { onKeyDown, onFocus, onBlur };
   }, [enabled, focusNext, focusPrevious, focusUp, focusDown, focusRowStart, focusRowEnd, focusTableStart, focusTableEnd, onFocusChange]);
-  const getHeaderKeyboardHandlers = useCallback9((columnIndex, onSort) => {
+  const getHeaderKeyboardHandlers = useCallback10((columnIndex, onSort) => {
     const onKeyDown = (event) => {
       if (!enabled) return;
       switch (event.key) {
@@ -10963,20 +11021,20 @@ function useKeyboardNavigation(rowCount, columnCount, options = {}) {
     };
     return { onKeyDown, onFocus };
   }, [enabled, getHeaderElement, columnCount, supportsColumnReorder, supportsColumnResize]);
-  const resetFocus = useCallback9(() => {
+  const resetFocus = useCallback10(() => {
     setState({
       focusedRowIndex: 0,
       focusedColumnIndex: 0,
       isNavigating: false
     });
   }, []);
-  const storeFocus = useCallback9(() => {
+  const storeFocus = useCallback10(() => {
     storedFocusRef.current = {
       rowIndex: state.focusedRowIndex,
       columnIndex: state.focusedColumnIndex
     };
   }, [state.focusedRowIndex, state.focusedColumnIndex]);
-  const restoreFocus = useCallback9(() => {
+  const restoreFocus = useCallback10(() => {
     if (storedFocusRef.current) {
       const { rowIndex, columnIndex } = storedFocusRef.current;
       focusCell(rowIndex, columnIndex);
@@ -11129,7 +11187,7 @@ function DataTableInternal({
     initializeLiveRegion();
   }, []);
   const rowSelection = selection !== void 0 ? selection : state.rowSelection;
-  const resolvedGetRowId = useCallback10(
+  const resolvedGetRowId = useCallback11(
     (row, index) => getRowIdSafe(row, index, getRowId),
     [getRowId]
   );
@@ -11313,12 +11371,13 @@ function DataTableInternal({
     finalDataCount
   ]);
   const isLoading = externalIsLoading || performanceLoading;
-  const handleSearch = useCallback10((value) => {
+  const handleSearch = useCallback11((value) => {
     stateActions.setSearchQuery(value);
+    setSearchQuery(value);
     if (secureFeatures.pagination) {
       stateActions.setPagination({ ...state.pagination, pageIndex: 0 });
     }
-  }, [stateActions, secureFeatures.pagination, state.pagination]);
+  }, [stateActions, setSearchQuery, secureFeatures.pagination, state.pagination]);
   useServerSideDataEffect({
     finalPaginationMode,
     serverSide,
@@ -11761,10 +11820,11 @@ function DataTableInternal({
               grouping: state.grouping,
               aggregates,
               getRowId: resolvedGetRowId,
-              emptyState: React17.isValidElement(emptyState) ? void 0 : emptyState,
+              emptyState: React18.isValidElement(emptyState) ? void 0 : emptyState,
               isFiltered: searchQuery !== "" || state.columnFilters.length > 0,
               onClearFilters: () => {
                 stateActions.setSearchQuery("");
+                setSearchQuery("");
                 stateActions.setColumnFilters([]);
               },
               enableFiltering: secureFeatures.filtering,
@@ -11824,30 +11884,30 @@ function DataTableCore(props) {
 // src/components/DataTable/DataTable.tsx
 import { jsx as jsx25 } from "react/jsx-runtime";
 function DataTable(props) {
-  const logger = React18.useMemo(() => createLogger("DataTable"), []);
+  const logger = React19.useMemo(() => createLogger("DataTable"), []);
   const { features, ...rest } = props;
   console.log("[DataTable] \u{1F3AF} DataTable WRAPPER called:", {
     dataLength: props.data?.length || 0,
     columnsCount: props.columns?.length || 0,
     pageName: props.rbac?.pageName || props.rbac?.pageId
   });
-  const normalizedFeatures = React18.useMemo(
+  const normalizedFeatures = React19.useMemo(
     () => normalizeDataTableFeatures(features),
     [features]
   );
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (!features && import.meta.env?.MODE === "development") {
       logger.info("DataTable: no features provided; all capabilities default to disabled. Pass a features object to enable functionality.");
     }
   }, [features, logger]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (normalizedFeatures.deleteSelected && !normalizedFeatures.deletion) {
       logger.warn("deleteSelected requires deletion to be enabled");
     }
   }, [normalizedFeatures.deleteSelected, normalizedFeatures.deletion, logger]);
   return /* @__PURE__ */ jsx25(DataTableCore, { ...rest, features: normalizedFeatures });
 }
-var DataTableComponent = React18.memo(DataTable);
+var DataTableComponent = React19.memo(DataTable);
 
 // src/components/DataTable/components/BulkOperationsDropdown.tsx
 import {
@@ -12059,4 +12119,4 @@ lodash/lodash.js:
    * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
    *)
 */
-//# sourceMappingURL=chunk-TZXYSZT3.js.map
+//# sourceMappingURL=chunk-PRM6EYO3.js.map