@refineui/react 0.0.9 → 0.0.10

package/dist/index.cjs

@@ -250,9 +250,11 @@ __export(index_exports, {
   SidebarPeekInset: () => SidebarPeekInset,
   SidebarPeekPanel: () => SidebarPeekPanel,
   SidebarPeekPin: () => SidebarPeekPin,
+  SidebarProvider: () => SidebarProvider,
+  SidebarTrigger: () => SidebarTrigger,
   Skeleton: () => Skeleton,
   Slider: () => Slider,
-  Slot: () => import_react57.Slot,
+  Slot: () => import_react59.Slot,
   Spacer: () => Spacer,
   SpinButton: () => SpinButton,
   Spinner: () => Spinner,
@@ -307,6 +309,7 @@ __export(index_exports, {
   semanticTextClass: () => semanticTextClass,
   sizedComponentTextClass: () => sizedComponentTextClass,
   toast: () => toast,
+  useSidebar: () => useSidebar,
   useSidebarPeek: () => useSidebarPeek
 });
 module.exports = __toCommonJS(index_exports);
@@ -348,14 +351,13 @@ var componentColorTokens = {
       states: buttonPrimaryColorTokens.states
     },
     secondary: {
-      background: semanticToken("backgroundPrimary"),
+      background: semanticToken("backgroundSurfaceHover"),
       foreground: semanticToken("foregroundPrimary"),
-      border: semanticToken("borderDefault"),
-      hoverBackground: semanticToken("backgroundSurfaceHover"),
-      hoverBorder: semanticToken("borderStrong"),
+      hoverBackground: semanticToken("backgroundSurfaceActive"),
+      hoverForeground: semanticToken("foregroundPrimaryHover"),
       activeBackground: semanticToken("backgroundSurfaceActive"),
+      activeForeground: semanticToken("foregroundPrimary"),
       disabledBackground: semanticToken("backgroundSurfaceDisabled"),
-      disabledBorder: semanticToken("borderDisabled"),
       disabledForeground: semanticToken("foregroundDisabled")
     },
     outline: {
@@ -1504,7 +1506,7 @@ function resolveSlotClasses(recipe, slot, variants = {}) {
 // src/recipes/button.recipe.ts
 var buttonVariantClass = {
   primary: "border-refineui-none border border-transparent bg-refineui-alias-background-brand text-refineui-alias-foreground-inversed",
-  secondary: "border-refineui-thin border-refineui-alias-border-default bg-refineui-alias-background-surface text-refineui-alias-foreground-primary",
+  secondary: "border-refineui-none border border-transparent bg-refineui-alias-background-surface-hover text-refineui-alias-foreground-primary",
   outline: "border-refineui-thin border-refineui-alias-border-default bg-transparent text-refineui-alias-foreground-primary",
   ghost: "border-refineui-none border border-transparent bg-transparent text-refineui-alias-foreground-primary"
 };
@@ -1542,6 +1544,10 @@ var buttonRecipe = defineRecipe({
       match: { layout: "icon", variant: "primary" },
       className: "border-0"
     },
+    {
+      match: { layout: "icon", variant: "secondary" },
+      className: "border-0"
+    },
     {
       match: { layout: "icon", variant: "ghost" },
       className: "border-0"
@@ -1576,7 +1582,7 @@ var Button = (0, import_react.forwardRef)(function Button2({
   const inactive = Boolean(disabled) || ariaDisabledProp === true || ariaDisabledProp === "true";
   const variantStyles = variant === "ghost" && layout === "icon" ? buttonStyles.iconGhost : buttonVariantClass[variant];
   const sizeStyles = layout === "icon" ? buttonIconSizeClass[size] : buttonLabelSizeClass[size];
-  const iconNoStroke = layout === "icon" && (variant === "primary" || variant === "ghost") ? "border-0" : null;
+  const iconNoStroke = layout === "icon" && (variant === "primary" || variant === "secondary" || variant === "ghost") ? "border-0" : null;
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     "button",
     {
@@ -11209,6 +11215,81 @@ function useSidebarPeek() {
   return useSidebarPeekContext("useSidebarPeek");
 }
 
+// src/components/Sidebar/SidebarProvider.tsx
+var import_react40 = require("react");
+var import_react41 = require("@refineui/utilities/react");
+var import_jsx_runtime62 = require("react/jsx-runtime");
+var SidebarContext = (0, import_react40.createContext)(null);
+function useSidebarContext(component) {
+  const value = (0, import_react40.useContext)(SidebarContext);
+  if (!value) throw new Error(`${component} must be used within <SidebarProvider>.`);
+  return value;
+}
+function useSidebar() {
+  return useSidebarContext("useSidebar");
+}
+function SidebarProvider({
+  open: openProp,
+  defaultOpen = true,
+  onOpenChange,
+  id,
+  children
+}) {
+  const [uncontrolled, setUncontrolled] = (0, import_react40.useState)(defaultOpen);
+  const open = openProp ?? uncontrolled;
+  const generatedId = (0, import_react40.useId)();
+  const sidebarId = id ?? generatedId;
+  const toggle = (0, import_react40.useCallback)(() => {
+    const next = !open;
+    if (openProp === void 0) setUncontrolled(next);
+    onOpenChange?.(next);
+  }, [onOpenChange, open, openProp]);
+  const value = (0, import_react40.useMemo)(
+    () => ({ open, sidebarId, toggle }),
+    [open, sidebarId, toggle]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(SidebarContext.Provider, { value, children });
+}
+var SidebarTrigger = (0, import_react40.forwardRef)(function SidebarTrigger2({
+  asChild = false,
+  onClick,
+  className,
+  children,
+  variant = "secondary",
+  size,
+  layout,
+  fullWidth,
+  type = "button",
+  ...props
+}, ref) {
+  const { open, toggle, sidebarId } = useSidebarContext("SidebarTrigger");
+  const shared = {
+    ...props,
+    ref,
+    "aria-expanded": open,
+    "aria-controls": sidebarId,
+    "data-state": open ? "open" : "closed",
+    className,
+    onClick: (event) => {
+      onClick?.(event);
+      if (!event.defaultPrevented) toggle();
+    }
+  };
+  if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react41.Slot, { ...shared, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    Button,
+    {
+      ...shared,
+      type,
+      variant,
+      size,
+      layout,
+      fullWidth,
+      children
+    }
+  );
+});
+
 // src/components/Pagination/Pagination.tsx
 var import_clsx84 = require("clsx");
 var import_tokens25 = require("@refineui/tokens");
@@ -11229,18 +11310,18 @@ var paginationStyles = {
 };
 
 // src/components/Pagination/Pagination.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 function PaginationRoot({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("nav", { "aria-label": "Pagination", className: (0, import_clsx84.clsx)(paginationStyles.root, className), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("nav", { "aria-label": "Pagination", className: (0, import_clsx84.clsx)(paginationStyles.root, className), ...props });
 }
 function PaginationContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ul", { className: (0, import_clsx84.clsx)(paginationStyles.listWrap, className), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("ul", { className: (0, import_clsx84.clsx)(paginationStyles.listWrap, className), ...props });
 }
 function PaginationItem({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("li", { className, ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("li", { className, ...props });
 }
 function PaginationLink({ className, isActive, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     "a",
     {
       "data-refineui": "pagination",
@@ -11260,7 +11341,7 @@ function PaginationNavButton({
 }) {
   const isPrev = direction === "prev";
   const iconColor = disabled ? (0, import_color10.resolveColorTokenValue)(componentColorTokens.pagination.navIcon.disabled) : (0, import_color10.resolveColorTokenValue)(componentColorTokens.pagination.navIcon.default);
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     "button",
     {
       type: "button",
@@ -11270,7 +11351,7 @@ function PaginationNavButton({
       "aria-label": isPrev ? "Previous page" : "Next page",
       className: (0, import_clsx84.clsx)(paginationStyles.itemShell, paginationStyles.nav, className),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         WebIcon,
         {
           name: isPrev ? "chevron-left" : "chevron-right",
@@ -11283,13 +11364,13 @@ function PaginationNavButton({
   );
 }
 function PaginationPrevious(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PaginationNavButton, { direction: "prev", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(PaginationNavButton, { direction: "prev", ...props });
 }
 function PaginationNext(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PaginationNavButton, { direction: "next", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(PaginationNavButton, { direction: "next", ...props });
 }
 function PaginationEllipsis({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
     "span",
     {
       "aria-hidden": true,
@@ -11297,7 +11378,7 @@ function PaginationEllipsis({ className, ...props }) {
       "data-ellipsis": "true",
       className: (0, import_clsx84.clsx)(paginationStyles.itemShell, paginationStyles.ellipsis, className),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         WebIcon,
         {
           name: "more-horizontal",
@@ -11310,15 +11391,15 @@ function PaginationEllipsis({ className, ...props }) {
   );
 }
 function Pagination(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(PaginationRoot, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(PaginationRoot, { ...props });
 }
 
 // src/components/PopOver/PopOver.tsx
 var import_clsx85 = require("clsx");
-var import_react40 = require("react");
+var import_react42 = require("react");
 var import_tokens26 = require("@refineui/tokens");
 var import_color11 = require("@refineui/utilities/color");
-var import_react41 = require("@refineui/utilities/react");
+var import_react43 = require("@refineui/utilities/react");
 
 // src/components/PopOver/style.ts
 var popoverStyles = {
@@ -11352,10 +11433,10 @@ function popoverFloatingClasses(placement, align) {
 }
 
 // src/components/PopOver/PopOver.tsx
-var import_jsx_runtime63 = require("react/jsx-runtime");
-var PopoverContext = (0, import_react40.createContext)(null);
+var import_jsx_runtime64 = require("react/jsx-runtime");
+var PopoverContext = (0, import_react42.createContext)(null);
 function usePopoverContext(component) {
-  const ctx = (0, import_react40.useContext)(PopoverContext);
+  const ctx = (0, import_react42.useContext)(PopoverContext);
   if (!ctx) throw new Error(`${component} must be used within <Popover>`);
   return ctx;
 }
@@ -11411,35 +11492,35 @@ function floatingGapStyle(placement) {
   return { marginLeft: POPOVER_GAP };
 }
 function Popover({ children, className, open: openProp, defaultOpen = false, onOpenChange, ...props }) {
-  const [internalOpen, setInternalOpen] = (0, import_react40.useState)(defaultOpen);
+  const [internalOpen, setInternalOpen] = (0, import_react42.useState)(defaultOpen);
   const open = openProp ?? internalOpen;
-  const setOpen = (0, import_react40.useCallback)(
+  const setOpen = (0, import_react42.useCallback)(
     (next) => {
       if (openProp === void 0) setInternalOpen(next);
       onOpenChange?.(next);
     },
     [openProp, onOpenChange]
   );
-  const toggle = (0, import_react40.useCallback)(() => setOpen(!open), [open, setOpen]);
-  const containerRef = (0, import_react40.useRef)(null);
-  const contentRef = (0, import_react40.useRef)(null);
-  const triggerRef = (0, import_react40.useRef)(null);
-  const contentId = (0, import_react40.useId)();
-  (0, import_react40.useEffect)(() => {
+  const toggle = (0, import_react42.useCallback)(() => setOpen(!open), [open, setOpen]);
+  const containerRef = (0, import_react42.useRef)(null);
+  const contentRef = (0, import_react42.useRef)(null);
+  const triggerRef = (0, import_react42.useRef)(null);
+  const contentId = (0, import_react42.useId)();
+  (0, import_react42.useEffect)(() => {
     const handler = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) setOpen(false);
     };
     if (open) document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open, setOpen]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react42.useEffect)(() => {
     const onKey = (e) => {
       if (e instanceof KeyboardEvent && e.key === "Escape") setOpen(false);
     };
     if (open) document.addEventListener("keydown", onKey);
     return () => document.removeEventListener("keydown", onKey);
   }, [open, setOpen]);
-  const onTriggerKeyDown = (0, import_react40.useCallback)(
+  const onTriggerKeyDown = (0, import_react42.useCallback)(
     (e) => {
       if (e.key === "Enter" || e.key === " ") {
         e.preventDefault();
@@ -11448,7 +11529,7 @@ function Popover({ children, className, open: openProp, defaultOpen = false, onO
     },
     [toggle]
   );
-  const value = (0, import_react40.useMemo)(
+  const value = (0, import_react42.useMemo)(
     () => ({
       open,
       setOpen,
@@ -11461,7 +11542,7 @@ function Popover({ children, className, open: openProp, defaultOpen = false, onO
     }),
     [open, setOpen, toggle, contentId, onTriggerKeyDown]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(PopoverContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PopoverContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     "div",
     {
       ref: containerRef,
@@ -11474,11 +11555,11 @@ function Popover({ children, className, open: openProp, defaultOpen = false, onO
 }
 function PopoverTrigger({ children, className, ...props }) {
   const { open, toggle, triggerRef, contentId, onTriggerKeyDown } = usePopoverContext("PopoverTrigger");
-  const mergeEl = (0, import_react41.getMergeableTriggerChild)(children);
+  const mergeEl = (0, import_react43.getMergeableTriggerChild)(children);
   if (mergeEl) {
     const passthrough = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
-      import_react41.Slot,
+    return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+      import_react43.Slot,
       {
         ref: triggerRef,
         ...props,
@@ -11499,7 +11580,7 @@ function PopoverTrigger({ children, className, ...props }) {
     );
   }
   const passthroughBtn = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     "button",
     {
       type: "button",
@@ -11542,7 +11623,7 @@ function PopoverContent({
   const rot = beakRotateDeg(placement);
   const gapStyle = floatingGapStyle(placement);
   if (!open) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     "div",
     {
       className: (0, import_clsx85.clsx)(
@@ -11550,8 +11631,8 @@ function PopoverContent({
         popoverFloatingClasses(placement, align)
       ),
       style: gapStyle,
-      children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: popoverStyles.panelWrap, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: popoverStyles.beakWrap, style: { ...bw, width: BEAK_W, height: BEAK_H }, "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: popoverStyles.panelWrap, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { className: popoverStyles.beakWrap, style: { ...bw, width: BEAK_W, height: BEAK_H }, "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
           "div",
           {
             style: {
@@ -11560,7 +11641,7 @@ function PopoverContent({
               transform: `rotate(${rot}deg)`,
               transformOrigin: "center center"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
               "svg",
               {
                 width: BEAK_W,
@@ -11570,14 +11651,14 @@ function PopoverContent({
                 xmlns: "http://www.w3.org/2000/svg",
                 style: { display: "block" },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("polygon", { points: "8,0 0,8 16,8", fill: borderCol }),
-                  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("polygon", { points: "8,2 2,8 14,8", fill: bg })
+                  /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("polygon", { points: "8,0 0,8 16,8", fill: borderCol }),
+                  /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("polygon", { points: "8,2 2,8 14,8", fill: bg })
                 ]
               }
             )
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
           "div",
           {
             ref: contentRef,
@@ -11617,9 +11698,9 @@ function PopOver({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(Popover, { className, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(PopoverTrigger, { children: trigger }),
-    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(PopoverContent, { placement, align, children: content })
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(Popover, { className, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PopoverTrigger, { children: trigger }),
+    /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(PopoverContent, { placement, align, children: content })
   ] });
 }
 
@@ -11635,7 +11716,7 @@ var skeletonStyles = {
 };
 
 // src/components/Skeleton/Skeleton.tsx
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 function Skeleton({
   width,
   height,
@@ -11667,7 +11748,7 @@ function Skeleton({
     w = width ?? "100%";
   }
   const dimStyle = { width: w, height: h };
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     "div",
     {
       "data-refineui": "skeleton",
@@ -11685,7 +11766,7 @@ function Skeleton({
 
 // src/components/Slider/Slider.tsx
 var import_clsx87 = require("clsx");
-var import_react42 = require("react");
+var import_react44 = require("react");
 
 // src/components/Slider/style.ts
 var sliderStyles = {
@@ -11693,7 +11774,7 @@ var sliderStyles = {
 };
 
 // src/components/Slider/Slider.tsx
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 function clampPct(n) {
   if (Number.isNaN(n)) return 0;
   return Math.min(100, Math.max(0, n));
@@ -11711,12 +11792,12 @@ function Slider({
   style,
   ...props
 }) {
-  const [internalFillPct, setInternalFillPct] = (0, import_react42.useState)(() => {
+  const [internalFillPct, setInternalFillPct] = (0, import_react44.useState)(() => {
     const v = defaultValue !== void 0 ? Number(defaultValue) : (min + max) / 2;
     return clampPct((v - min) / (max - min) * 100);
   });
   const fillPct = value !== void 0 ? clampPct((Number(value) - min) / (max - min) * 100) : internalFillPct;
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
     "input",
     {
       type: "range",
@@ -11753,7 +11834,7 @@ function Slider({
 // src/components/Carousel/Carousel.tsx
 var import_clsx89 = require("clsx");
 var import_tokens27 = require("@refineui/tokens");
-var import_react43 = require("react");
+var import_react45 = require("react");
 
 // src/components/Carousel/style.ts
 var import_clsx88 = require("clsx");
@@ -11785,11 +11866,11 @@ var carouselStyles = {
 };
 
 // src/components/Carousel/Carousel.tsx
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var DRAG_COMMIT_RATIO = 0.18;
-var CarouselContext = (0, import_react43.createContext)(null);
+var CarouselContext = (0, import_react45.createContext)(null);
 function useCarouselContext(component) {
-  const v = (0, import_react43.useContext)(CarouselContext);
+  const v = (0, import_react45.useContext)(CarouselContext);
   if (!v) throw new Error(`${component} must be used within Carousel.`);
   return v;
 }
@@ -11808,13 +11889,13 @@ function Carousel({
   ...props
 }) {
   const isControlled = indexControlled !== void 0;
-  const [internalIndex, setInternalIndex] = (0, import_react43.useState)(defaultIndex);
-  const [count, setCount] = (0, import_react43.useState)(0);
-  const [trackIndex, setTrackIndex] = (0, import_react43.useState)(defaultIndex);
-  const [instant, setInstant] = (0, import_react43.useState)(false);
+  const [internalIndex, setInternalIndex] = (0, import_react45.useState)(defaultIndex);
+  const [count, setCount] = (0, import_react45.useState)(0);
+  const [trackIndex, setTrackIndex] = (0, import_react45.useState)(defaultIndex);
+  const [instant, setInstant] = (0, import_react45.useState)(false);
   const index = isControlled ? indexControlled : internalIndex;
   const loopActive = loop && count > 1;
-  const commitLogical = (0, import_react43.useCallback)(
+  const commitLogical = (0, import_react45.useCallback)(
     (next) => {
       const normalized = clampIndex(next, Math.max(count, 1));
       if (!isControlled) setInternalIndex(normalized);
@@ -11822,13 +11903,13 @@ function Carousel({
     },
     [count, isControlled, onIndexChange]
   );
-  (0, import_react43.useLayoutEffect)(() => {
+  (0, import_react45.useLayoutEffect)(() => {
     if (count <= 0) return;
     const logical = clampIndex(index, count);
     if (logical !== index) commitLogical(logical);
     setTrackIndex(loopActive ? logical + 1 : logical);
   }, [count, loopActive]);
-  (0, import_react43.useEffect)(() => {
+  (0, import_react45.useEffect)(() => {
     if (count <= 0) return;
     if (!loopActive) {
       setTrackIndex(clampIndex(index, count));
@@ -11842,7 +11923,7 @@ function Carousel({
   }, [index, count, loopActive]);
   const canScrollPrev = loopActive ? true : index > 0;
   const canScrollNext = loopActive ? true : index < count - 1;
-  const scrollTo = (0, import_react43.useCallback)(
+  const scrollTo = (0, import_react45.useCallback)(
     (i) => {
       if (count <= 0) return;
       const next = clampIndex(i, count);
@@ -11851,7 +11932,7 @@ function Carousel({
     },
     [commitLogical, count, loopActive]
   );
-  const scrollPrev = (0, import_react43.useCallback)(() => {
+  const scrollPrev = (0, import_react45.useCallback)(() => {
     if (count <= 0) return;
     if (loopActive) {
       if (trackIndex < 1 || trackIndex > count) return;
@@ -11864,7 +11945,7 @@ function Carousel({
       setTrackIndex(index - 1);
     }
   }, [commitLogical, count, index, loopActive, trackIndex]);
-  const scrollNext = (0, import_react43.useCallback)(() => {
+  const scrollNext = (0, import_react45.useCallback)(() => {
     if (count <= 0) return;
     if (loopActive) {
       if (trackIndex < 1 || trackIndex > count) return;
@@ -11877,7 +11958,7 @@ function Carousel({
       setTrackIndex(index + 1);
     }
   }, [commitLogical, count, index, loopActive, trackIndex]);
-  const onTrackSettled = (0, import_react43.useCallback)(() => {
+  const onTrackSettled = (0, import_react45.useCallback)(() => {
     if (!loopActive) return;
     if (trackIndex === 0) {
       setInstant(true);
@@ -11893,7 +11974,7 @@ function Carousel({
       });
     }
   }, [count, loopActive, trackIndex]);
-  const ctx = (0, import_react43.useMemo)(
+  const ctx = (0, import_react45.useMemo)(
     () => ({
       index,
       count,
@@ -11948,7 +12029,7 @@ function Carousel({
         break;
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(CarouselContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(CarouselContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     "div",
     {
       "data-refineui": "carousel",
@@ -11972,21 +12053,21 @@ function CarouselContent({ className, children, ...props }) {
     instant,
     onTrackSettled
   } = useCarouselContext("CarouselContent");
-  const viewportRef = (0, import_react43.useRef)(null);
-  const dragStartX = (0, import_react43.useRef)(null);
-  const [dragPx, setDragPx] = (0, import_react43.useState)(0);
-  const [dragging, setDragging] = (0, import_react43.useState)(false);
-  const slides = import_react43.Children.toArray(children).filter(import_react43.isValidElement);
+  const viewportRef = (0, import_react45.useRef)(null);
+  const dragStartX = (0, import_react45.useRef)(null);
+  const [dragPx, setDragPx] = (0, import_react45.useState)(0);
+  const [dragging, setDragging] = (0, import_react45.useState)(false);
+  const slides = import_react45.Children.toArray(children).filter(import_react45.isValidElement);
   const slideCount = slides.length;
-  (0, import_react43.useEffect)(() => {
+  (0, import_react45.useEffect)(() => {
     setCount(slideCount);
   }, [setCount, slideCount]);
   const trackSlides = loop && slides.length > 1 ? [
-    (0, import_react43.cloneElement)(slides[slides.length - 1], { key: "__carousel-clone-last" }),
+    (0, import_react45.cloneElement)(slides[slides.length - 1], { key: "__carousel-clone-last" }),
     ...slides,
-    (0, import_react43.cloneElement)(slides[0], { key: "__carousel-clone-first" })
+    (0, import_react45.cloneElement)(slides[0], { key: "__carousel-clone-first" })
   ] : slides;
-  const endDrag = (0, import_react43.useCallback)(
+  const endDrag = (0, import_react45.useCallback)(
     (clientX) => {
       if (dragStartX.current == null) return;
       const width = viewportRef.current?.offsetWidth ?? 1;
@@ -12035,7 +12116,7 @@ function CarouselContent({ className, children, ...props }) {
   };
   const animated = !dragging && !instant;
   const transform = dragPx !== 0 ? `translate3d(calc(-${trackIndex * 100}% + ${dragPx}px), 0, 0)` : `translate3d(-${trackIndex * 100}%, 0, 0)`;
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     "div",
     {
       ref: viewportRef,
@@ -12046,7 +12127,7 @@ function CarouselContent({ className, children, ...props }) {
       onPointerMove,
       onPointerUp,
       onPointerCancel,
-      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
         "div",
         {
           "data-refineui": "carousel-track",
@@ -12061,9 +12142,9 @@ function CarouselContent({ className, children, ...props }) {
     }
   );
 }
-var CarouselItem = (0, import_react43.forwardRef)(function CarouselItem2({ className, children, ...props }, ref) {
+var CarouselItem = (0, import_react45.forwardRef)(function CarouselItem2({ className, children, ...props }, ref) {
   useCarouselContext("CarouselItem");
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     "div",
     {
       ref,
@@ -12078,12 +12159,12 @@ var CarouselItem = (0, import_react43.forwardRef)(function CarouselItem2({ class
 });
 function CarouselControls({ className, children, ...props }) {
   useCarouselContext("CarouselControls");
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { "data-refineui": "carousel-controls", className: (0, import_clsx89.clsx)(carouselStyles.controls, className), ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { "data-refineui": "carousel-controls", className: (0, import_clsx89.clsx)(carouselStyles.controls, className), ...props, children });
 }
 function CarouselPrevious({ className, disabled, onClick, ...props }) {
   const { scrollPrev, canScrollPrev } = useCarouselContext("CarouselPrevious");
   const isDisabled = disabled || !canScrollPrev;
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     Button,
     {
       variant: "outline",
@@ -12099,7 +12180,7 @@ function CarouselPrevious({ className, disabled, onClick, ...props }) {
         onClick?.(e);
         if (!e.defaultPrevented && !isDisabled) scrollPrev();
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
         WebIcon,
         {
           name: "chevron-left",
@@ -12115,7 +12196,7 @@ function CarouselPrevious({ className, disabled, onClick, ...props }) {
 function CarouselNext({ className, disabled, onClick, ...props }) {
   const { scrollNext, canScrollNext } = useCarouselContext("CarouselNext");
   const isDisabled = disabled || !canScrollNext;
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     Button,
     {
       variant: "outline",
@@ -12131,7 +12212,7 @@ function CarouselNext({ className, disabled, onClick, ...props }) {
         onClick?.(e);
         if (!e.defaultPrevented && !isDisabled) scrollNext();
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
         WebIcon,
         {
           name: "chevron-right",
@@ -12146,9 +12227,9 @@ function CarouselNext({ className, disabled, onClick, ...props }) {
 }
 function CarouselIndicators({ className, ...props }) {
   const { count, index, scrollTo } = useCarouselContext("CarouselIndicators");
-  const trackRef = (0, import_react43.useRef)(null);
-  const [thumb, setThumb] = (0, import_react43.useState)({ width: 0, x: 0, ready: false });
-  const updateThumb = (0, import_react43.useCallback)(() => {
+  const trackRef = (0, import_react45.useRef)(null);
+  const [thumb, setThumb] = (0, import_react45.useState)({ width: 0, x: 0, ready: false });
+  const updateThumb = (0, import_react45.useCallback)(() => {
     const el = trackRef.current;
     if (!el || count <= 0) {
       setThumb({ width: 0, x: 0, ready: false });
@@ -12163,10 +12244,10 @@ function CarouselIndicators({ className, ...props }) {
       ready: true
     });
   }, [count, index]);
-  (0, import_react43.useLayoutEffect)(() => {
+  (0, import_react45.useLayoutEffect)(() => {
     updateThumb();
   }, [updateThumb]);
-  (0, import_react43.useEffect)(() => {
+  (0, import_react45.useEffect)(() => {
     const el = trackRef.current;
     if (!el) return;
     const ro = new ResizeObserver(() => updateThumb());
@@ -12178,7 +12259,7 @@ function CarouselIndicators({ className, ...props }) {
     width: thumb.width,
     transform: `translate3d(${thumb.x}px, 0, 0)`
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
     "div",
     {
       ref: trackRef,
@@ -12188,7 +12269,7 @@ function CarouselIndicators({ className, ...props }) {
       className: (0, import_clsx89.clsx)(carouselStyles.indicators, className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
           "span",
           {
             "data-refineui": "carousel-indicator-thumb",
@@ -12198,7 +12279,7 @@ function CarouselIndicators({ className, ...props }) {
             style: thumbStyle
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { "data-refineui": "carousel-indicator-hits", className: carouselStyles.indicatorHitRow, children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { "data-refineui": "carousel-indicator-hits", className: carouselStyles.indicatorHitRow, children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
           "button",
           {
             type: "button",
@@ -12219,7 +12300,7 @@ function CarouselIndicators({ className, ...props }) {
 
 // src/components/Bubble/Bubble.tsx
 var import_clsx91 = require("clsx");
-var import_react44 = require("react");
+var import_react46 = require("react");
 
 // src/components/Bubble/style.ts
 var import_clsx90 = require("clsx");
@@ -12284,21 +12365,21 @@ var bubbleContentVariantClass = {
 };
 
 // src/components/Bubble/Bubble.tsx
-var import_jsx_runtime67 = require("react/jsx-runtime");
-var BubbleContext = (0, import_react44.createContext)(null);
+var import_jsx_runtime68 = require("react/jsx-runtime");
+var BubbleContext = (0, import_react46.createContext)(null);
 function useBubbleContext(component) {
-  const value = (0, import_react44.useContext)(BubbleContext);
+  const value = (0, import_react46.useContext)(BubbleContext);
   if (!value) throw new Error(`${component} must be used within Bubble.`);
   return value;
 }
 function isBubbleReactionsElement(node) {
-  return (0, import_react44.isValidElement)(node) && node.type === BubbleReactions;
+  return (0, import_react46.isValidElement)(node) && node.type === BubbleReactions;
 }
 function partitionBubbleChildren(children) {
   const top = [];
   const middle = [];
   const bottom = [];
-  import_react44.Children.forEach(children, (child) => {
+  import_react46.Children.forEach(children, (child) => {
     if (!isBubbleReactionsElement(child)) {
       middle.push(child);
       return;
@@ -12316,7 +12397,7 @@ function partitionBubbleChildren(children) {
   };
 }
 function BubbleGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "div",
     {
       "data-refineui": "bubble-group",
@@ -12335,7 +12416,7 @@ function Bubble({
 }) {
   const rootStyle = variant === "ghost" ? style : { maxWidth: BUBBLE_MAX_WIDTH, ...style };
   const { top, middle, bottom, hasTop, hasBottom } = partitionBubbleChildren(children);
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(BubbleContext.Provider, { value: { variant, align }, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(BubbleContext.Provider, { value: { variant, align }, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "div",
     {
       "data-refineui": "bubble",
@@ -12350,7 +12431,7 @@ function Bubble({
       ),
       style: rootStyle,
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)("div", { "data-refineui": "bubble-surface", className: bubbleStyles.surface, children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { "data-refineui": "bubble-surface", className: bubbleStyles.surface, children: [
         middle,
         top,
         bottom
@@ -12360,7 +12441,7 @@ function Bubble({
 }
 function BubbleContent({ className, ...props }) {
   const { variant } = useBubbleContext("BubbleContent");
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "div",
     {
       "data-refineui": "bubble-content",
@@ -12381,7 +12462,7 @@ function BubbleReactions({
 }) {
   const { align: bubbleAlign } = useBubbleContext("BubbleReactions");
   const align = alignProp ?? (bubbleAlign === "start" ? "end" : "start");
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "div",
     {
       "data-refineui": "bubble-reactions",
@@ -12401,7 +12482,7 @@ function BubbleReactions({
 // src/components/Stepper/Stepper.tsx
 var import_clsx93 = require("clsx");
 var import_tokens28 = require("@refineui/tokens");
-var import_react45 = require("react");
+var import_react47 = require("react");
 
 // src/components/Stepper/style.ts
 var import_clsx92 = require("clsx");
@@ -12509,17 +12590,17 @@ var stepperConnectorVars = {
 };
 
 // src/components/Stepper/Stepper.tsx
-var import_jsx_runtime68 = require("react/jsx-runtime");
-var StepperContext = (0, import_react45.createContext)(null);
-var StepperItemContext = (0, import_react45.createContext)(null);
-var StepperListRegistryContext = (0, import_react45.createContext)(null);
+var import_jsx_runtime69 = require("react/jsx-runtime");
+var StepperContext = (0, import_react47.createContext)(null);
+var StepperItemContext = (0, import_react47.createContext)(null);
+var StepperListRegistryContext = (0, import_react47.createContext)(null);
 function useStepperContext(component) {
-  const v = (0, import_react45.useContext)(StepperContext);
+  const v = (0, import_react47.useContext)(StepperContext);
   if (!v) throw new Error(`${component} must be used within Stepper.`);
   return v;
 }
 function useStepperItemContext(component) {
-  const v = (0, import_react45.useContext)(StepperItemContext);
+  const v = (0, import_react47.useContext)(StepperItemContext);
   if (!v) throw new Error(`${component} must be used within StepperItem.`);
   return v;
 }
@@ -12539,16 +12620,16 @@ function Stepper({
   ...props
 }) {
   const isControlled = valueControlled !== void 0;
-  const [internalValue, setInternalValue] = (0, import_react45.useState)(defaultValue);
+  const [internalValue, setInternalValue] = (0, import_react47.useState)(defaultValue);
   const value = isControlled ? valueControlled : internalValue;
-  const setValue = (0, import_react45.useCallback)(
+  const setValue = (0, import_react47.useCallback)(
     (next) => {
       if (!isControlled) setInternalValue(next);
       onValueChange?.(next);
     },
     [isControlled, onValueChange]
   );
-  const ctx = (0, import_react45.useMemo)(
+  const ctx = (0, import_react47.useMemo)(
     () => ({
       value,
       setValue,
@@ -12557,7 +12638,7 @@ function Stepper({
     }),
     [value, setValue, orientation, onValueChange, isControlled]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(StepperContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(StepperContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-refineui": "stepper",
@@ -12571,9 +12652,9 @@ function Stepper({
 }
 function StepperList({ className, children, ...props }) {
   const { orientation, value } = useStepperContext("StepperList");
-  const cursorRef = (0, import_react45.useRef)(null);
+  const cursorRef = (0, import_react47.useRef)(null);
   cursorRef.current = null;
-  const registry = (0, import_react45.useMemo)(
+  const registry = (0, import_react47.useMemo)(
     () => ({
       noteItem(itemValue) {
         cursorRef.current = itemValue;
@@ -12585,7 +12666,7 @@ function StepperList({ className, children, ...props }) {
     }),
     [value]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(StepperListRegistryContext.Provider, { value: registry, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(StepperListRegistryContext.Provider, { value: registry, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "ol",
     {
       "data-refineui": "stepper-list",
@@ -12610,7 +12691,7 @@ function StepperItem({
   ...props
 }) {
   const { value, setValue, orientation, interactive } = useStepperContext("StepperItem");
-  const registry = (0, import_react45.useContext)(StepperListRegistryContext);
+  const registry = (0, import_react47.useContext)(StepperListRegistryContext);
   registry?.noteItem(itemValue);
   const state = resolveState2(itemValue, value);
   const canActivate = interactive && !disabled;
@@ -12626,11 +12707,11 @@ function StepperItem({
       activate();
     }
   };
-  const itemCtx = (0, import_react45.useMemo)(
+  const itemCtx = (0, import_react47.useMemo)(
     () => ({ state, disabled }),
     [state, disabled]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(StepperItemContext.Provider, { value: itemCtx, children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(StepperItemContext.Provider, { value: itemCtx, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "li",
     {
       "data-refineui": "stepper-item",
@@ -12658,7 +12739,7 @@ function StepperItem({
 function StepperIndicator({ className, children, ...props }) {
   const { state } = useStepperItemContext("StepperIndicator");
   const stateClass = state === "complete" ? stepperStyles.indicatorComplete : state === "current" ? stepperStyles.indicatorCurrent : stepperStyles.indicatorUpcoming;
-  const content = state === "upcoming" ? children : /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  const content = state === "upcoming" ? children : /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     WebIcon,
     {
       name: "checkmark",
@@ -12669,7 +12750,7 @@ function StepperIndicator({ className, children, ...props }) {
       className: "items-center justify-center"
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "span",
     {
       "data-refineui": "stepper-indicator",
@@ -12684,7 +12765,7 @@ function StepperIndicator({ className, children, ...props }) {
 function StepperContent({ className, ...props }) {
   const { orientation } = useStepperContext("StepperContent");
   useStepperItemContext("StepperContent");
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-refineui": "stepper-content",
@@ -12700,7 +12781,7 @@ function StepperContent({ className, ...props }) {
 function StepperTitle({ className, ...props }) {
   const { state } = useStepperItemContext("StepperTitle");
   const stateClass = state === "complete" ? stepperStyles.titleComplete : state === "current" ? stepperStyles.titleCurrent : stepperStyles.titleUpcoming;
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "span",
     {
       "data-refineui": "stepper-title",
@@ -12713,7 +12794,7 @@ function StepperTitle({ className, ...props }) {
 function StepperDescription({ className, ...props }) {
   const { state } = useStepperItemContext("StepperDescription");
   const stateClass = state === "complete" ? stepperStyles.descriptionComplete : state === "current" ? stepperStyles.descriptionCurrent : stepperStyles.descriptionUpcoming;
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "span",
     {
       "data-refineui": "stepper-description",
@@ -12725,10 +12806,10 @@ function StepperDescription({ className, ...props }) {
 }
 function StepperSeparator({ className, ...props }) {
   const { orientation } = useStepperContext("StepperSeparator");
-  const registry = (0, import_react45.useContext)(StepperListRegistryContext);
+  const registry = (0, import_react47.useContext)(StepperListRegistryContext);
   const state = registry?.takeSeparatorState() ?? "upcoming";
   const vertical = orientation === "vertical";
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "li",
     {
       "data-refineui": "stepper-separator",
@@ -12742,7 +12823,7 @@ function StepperSeparator({ className, ...props }) {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(
         "span",
         {
           "data-refineui": "stepper-separator-rail",
@@ -12751,14 +12832,14 @@ function StepperSeparator({ className, ...props }) {
             vertical ? stepperStyles.separatorRailVertical : stepperStyles.separatorRailHorizontal
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
               "span",
               {
                 "data-refineui": "stepper-separator-track",
                 className: stepperStyles.separatorTrack
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
               "span",
               {
                 "data-refineui": "stepper-separator-fill",
@@ -12786,7 +12867,7 @@ StepperSeparator.displayName = "StepperSeparator";
 
 // src/components/Resizable/Resizable.tsx
 var import_clsx95 = require("clsx");
-var import_react46 = require("react");
+var import_react48 = require("react");
 
 // src/components/Resizable/style.ts
 var import_clsx94 = require("clsx");
@@ -12821,15 +12902,15 @@ var resizableStyles = {
 };
 
 // src/components/Resizable/Resizable.tsx
-var import_jsx_runtime69 = require("react/jsx-runtime");
+var import_jsx_runtime70 = require("react/jsx-runtime");
 var KEYBOARD_STEP = 2;
 var KEYBOARD_STEP_LARGE = 10;
 var DEFAULT_SIZE = 50;
 var DEFAULT_MIN_SIZE = 10;
 var DEFAULT_MAX_SIZE = 100;
-var ResizableContext = (0, import_react46.createContext)(null);
+var ResizableContext = (0, import_react48.createContext)(null);
 function useResizableContext(component) {
-  const v = (0, import_react46.useContext)(ResizableContext);
+  const v = (0, import_react48.useContext)(ResizableContext);
   if (!v) throw new Error(`${component} must be used within ResizablePanelGroup.`);
   return v;
 }
@@ -12888,13 +12969,13 @@ function ResizablePanelGroup({
   onLayout,
   ...props
 }) {
-  const groupRef = (0, import_react46.useRef)(null);
-  const panelsRef = (0, import_react46.useRef)(/* @__PURE__ */ new Map());
-  const orderCounterRef = (0, import_react46.useRef)(0);
-  const [sizes, setSizes] = (0, import_react46.useState)({});
-  const onLayoutRef = (0, import_react46.useRef)(onLayout);
+  const groupRef = (0, import_react48.useRef)(null);
+  const panelsRef = (0, import_react48.useRef)(/* @__PURE__ */ new Map());
+  const orderCounterRef = (0, import_react48.useRef)(0);
+  const [sizes, setSizes] = (0, import_react48.useState)({});
+  const onLayoutRef = (0, import_react48.useRef)(onLayout);
   onLayoutRef.current = onLayout;
-  const syncInitialSizes = (0, import_react46.useCallback)(() => {
+  const syncInitialSizes = (0, import_react48.useCallback)(() => {
     const panels = [...panelsRef.current.values()].sort((a, b) => a.order - b.order);
     if (panels.length === 0) return;
     setSizes((prev) => {
@@ -12929,7 +13010,7 @@ function ResizablePanelGroup({
       return base;
     });
   }, []);
-  const registerPanel = (0, import_react46.useCallback)(
+  const registerPanel = (0, import_react48.useCallback)(
     (panel) => {
       const existing = panelsRef.current.get(panel.id);
       const order = existing?.order ?? orderCounterRef.current++;
@@ -12938,7 +13019,7 @@ function ResizablePanelGroup({
     },
     [syncInitialSizes]
   );
-  const unregisterPanel = (0, import_react46.useCallback)((id) => {
+  const unregisterPanel = (0, import_react48.useCallback)((id) => {
     panelsRef.current.delete(id);
     setSizes((prev) => {
       if (!(id in prev)) return prev;
@@ -12947,13 +13028,13 @@ function ResizablePanelGroup({
       return next;
     });
   }, []);
-  const getPanel = (0, import_react46.useCallback)((id) => panelsRef.current.get(id), []);
-  const emitPanelResize = (0, import_react46.useCallback)((next) => {
+  const getPanel = (0, import_react48.useCallback)((id) => panelsRef.current.get(id), []);
+  const emitPanelResize = (0, import_react48.useCallback)((next) => {
     for (const [id, size] of Object.entries(next)) {
       panelsRef.current.get(id)?.onResize?.(size);
     }
   }, []);
-  const resizeBetween = (0, import_react46.useCallback)(
+  const resizeBetween = (0, import_react48.useCallback)(
     (leftId, rightId, deltaPct) => {
       setSizes((prev) => {
         const next = applyResize(
@@ -12970,7 +13051,7 @@ function ResizablePanelGroup({
     },
     [emitPanelResize]
   );
-  const setBetween = (0, import_react46.useCallback)(
+  const setBetween = (0, import_react48.useCallback)(
     (leftId, rightId, leftSize) => {
       setSizes((prev) => {
         const left = panelsRef.current.get(leftId);
@@ -12995,13 +13076,13 @@ function ResizablePanelGroup({
     },
     [emitPanelResize]
   );
-  (0, import_react46.useLayoutEffect)(() => {
+  (0, import_react48.useLayoutEffect)(() => {
     const ids = orderedPanelIds(panelsRef.current);
     if (ids.length === 0) return;
     if (ids.some((id) => sizes[id] === void 0)) return;
     onLayoutRef.current?.(ids.map((id) => sizes[id]));
   }, [sizes]);
-  const ctx = (0, import_react46.useMemo)(
+  const ctx = (0, import_react48.useMemo)(
     () => ({
       orientation,
       groupRef,
@@ -13022,7 +13103,7 @@ function ResizablePanelGroup({
       setBetween
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ResizableContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ResizableContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
     "div",
     {
       ref: groupRef,
@@ -13050,11 +13131,11 @@ function ResizablePanel({
   onResize,
   ...props
 }) {
-  const id = (0, import_react46.useId)();
+  const id = (0, import_react48.useId)();
   const { orientation, sizes, registerPanel, unregisterPanel } = useResizableContext("ResizablePanel");
-  const onResizeRef = (0, import_react46.useRef)(onResize);
+  const onResizeRef = (0, import_react48.useRef)(onResize);
   onResizeRef.current = onResize;
-  (0, import_react46.useLayoutEffect)(() => {
+  (0, import_react48.useLayoutEffect)(() => {
     registerPanel({
       id,
       defaultSize,
@@ -13081,7 +13162,7 @@ function ResizablePanel({
     flexBasis: 0,
     ...orientation === "horizontal" ? { minWidth: `${minSize}%` } : { minHeight: `${minSize}%` }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
     "div",
     {
       "data-refineui": "resizable-panel",
@@ -13112,11 +13193,11 @@ function ResizableHandle({
     resizeBetween,
     setBetween
   } = useResizableContext("ResizableHandle");
-  const handleRef = (0, import_react46.useRef)(null);
-  const [active, setActive] = (0, import_react46.useState)(false);
-  const [, setAdjacentReady] = (0, import_react46.useState)(false);
-  const dragRef = (0, import_react46.useRef)(null);
-  (0, import_react46.useLayoutEffect)(() => {
+  const handleRef = (0, import_react48.useRef)(null);
+  const [active, setActive] = (0, import_react48.useState)(false);
+  const [, setAdjacentReady] = (0, import_react48.useState)(false);
+  const dragRef = (0, import_react48.useRef)(null);
+  (0, import_react48.useLayoutEffect)(() => {
     setAdjacentReady(true);
   }, []);
   const adjacent = handleRef.current ? findAdjacentPanelIds(handleRef.current) : { leftId: null, rightId: null };
@@ -13127,7 +13208,7 @@ function ResizableHandle({
   const ariaMin = leftPanel?.minSize ?? 0;
   const ariaMax = leftPanel?.maxSize ?? DEFAULT_MAX_SIZE;
   const defaultKeyshortcuts = orientation === "horizontal" ? "ArrowLeft ArrowRight Home End" : "ArrowUp ArrowDown Home End";
-  const keepFocus = (0, import_react46.useCallback)(() => {
+  const keepFocus = (0, import_react48.useCallback)(() => {
     const el = handleRef.current;
     if (el && document.activeElement !== el) {
       el.focus({ preventScroll: true });
@@ -13226,7 +13307,7 @@ function ResizableHandle({
     resizeBetween(leftId, rightId, delta);
     queueMicrotask(keepFocus);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
     "div",
     {
       ref: handleRef,
@@ -13256,7 +13337,7 @@ function ResizableHandle({
       onPointerUp: handlePointerUp,
       onPointerCancel: handlePointerUp,
       onKeyDown: handleKeyDown,
-      children: withHandle ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+      children: withHandle ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
         "span",
         {
           "aria-hidden": true,
@@ -13272,7 +13353,7 @@ function ResizableHandle({
 
 // src/components/SpinButton/SpinButton.tsx
 var import_clsx96 = require("clsx");
-var import_react47 = require("react");
+var import_react49 = require("react");
 var import_tokens29 = require("@refineui/tokens");
 
 // src/components/SpinButton/style.ts
@@ -13296,7 +13377,7 @@ var spinButtonShellClass = formControlShellHeightClass;
 var spinButtonValueTypo = formControlTypoClass;
 
 // src/components/SpinButton/SpinButton.tsx
-var import_jsx_runtime70 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 function SpinButton({
   value,
   onChange,
@@ -13310,8 +13391,8 @@ function SpinButton({
   onKeyDown,
   ...props
 }) {
-  const [draftValue, setDraftValue] = (0, import_react47.useState)(String(value));
-  (0, import_react47.useEffect)(() => {
+  const [draftValue, setDraftValue] = (0, import_react49.useState)(String(value));
+  (0, import_react49.useEffect)(() => {
     setDraftValue(String(value));
   }, [value]);
   const clampValue2 = (next) => {
@@ -13399,7 +13480,7 @@ function SpinButton({
   const atMax = max !== void 0 && value >= max;
   const atMin = min !== void 0 && value <= min;
   const borderClass = disabled ? spinButtonStyles.borderDisabled : spinButtonStyles.borderDefault;
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
     "div",
     {
       role: "spinbutton",
@@ -13422,7 +13503,7 @@ function SpinButton({
       ...props,
       onKeyDown: handleKeyDown,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
           "div",
           {
             "aria-live": "polite",
@@ -13433,7 +13514,7 @@ function SpinButton({
               disabled ? spinButtonStyles.valueTextDisabled : spinButtonStyles.valueTextDefault,
               disabled ? spinButtonStyles.bgDisabled : spinButtonStyles.bgDefault
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
               "input",
               {
                 type: "text",
@@ -13458,7 +13539,7 @@ function SpinButton({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
           "div",
           {
             className: (0, import_clsx96.clsx)(
@@ -13466,7 +13547,7 @@ function SpinButton({
               disabled ? spinButtonStyles.bgDisabled : spinButtonStyles.bgDefault
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
                 "button",
                 {
                   type: "button",
@@ -13478,7 +13559,7 @@ function SpinButton({
                     spinButtonStyles.stepButtonBase,
                     disabled || atMax ? spinButtonStyles.stepButtonDisabled : spinButtonStyles.stepButtonEnabled
                   ),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
                     WebIcon,
                     {
                       name: "chevron-up",
@@ -13490,7 +13571,7 @@ function SpinButton({
                   )
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
                 "button",
                 {
                   type: "button",
@@ -13502,7 +13583,7 @@ function SpinButton({
                     spinButtonStyles.stepButtonBase,
                     disabled || atMin ? spinButtonStyles.stepButtonDisabled : spinButtonStyles.stepButtonEnabled
                   ),
-                  children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
                     WebIcon,
                     {
                       name: "chevron-down",
@@ -13524,7 +13605,7 @@ function SpinButton({
 
 // src/components/Toast/Toast.tsx
 var import_clsx98 = require("clsx");
-var import_react48 = require("react");
+var import_react50 = require("react");
 var import_react_dom6 = require("react-dom");
 var import_tokens30 = require("@refineui/tokens");
 var import_animation7 = require("@refineui/utilities/animation");
@@ -13561,8 +13642,8 @@ var toastStyles = {
 };
 
 // src/components/Toast/Toast.tsx
-var import_jsx_runtime71 = require("react/jsx-runtime");
-var useIsomorphicLayoutEffect6 = typeof document !== "undefined" ? import_react48.useLayoutEffect : import_react48.useEffect;
+var import_jsx_runtime72 = require("react/jsx-runtime");
+var useIsomorphicLayoutEffect6 = typeof document !== "undefined" ? import_react50.useLayoutEffect : import_react50.useEffect;
 var ENTER_MS = 20;
 var LEAVE_MS = (0, import_animation7.motionMsToNumber)(componentTokens.toast.motion.leave) + 60;
 var DEFAULT_DURATION = 4200;
@@ -13598,7 +13679,7 @@ function subscribeToastStackGap(onChange) {
   return () => mq.removeEventListener("change", onChange);
 }
 function useToastStackGapPx() {
-  return (0, import_react48.useSyncExternalStore)(
+  return (0, import_react50.useSyncExternalStore)(
     subscribeToastStackGap,
     readToastStackGapPx,
     () => gapPxFromSpacingToken(String(import_tokens30.spacings.sizeLarge))
@@ -13740,7 +13821,7 @@ var variantIconNames = {
   error: "error-circle",
   warning: "warning"
 };
-var Toast = (0, import_react48.forwardRef)(function Toast2(props, ref) {
+var Toast = (0, import_react50.forwardRef)(function Toast2(props, ref) {
   const { variant = "default", message, iconName, icon, action, className, stackState, style, ...rest } = props;
   const domProps = { ...rest };
   delete domProps.iconName;
@@ -13749,7 +13830,7 @@ var Toast = (0, import_react48.forwardRef)(function Toast2(props, ref) {
   const liveRole = variant === "error" ? "alert" : "status";
   const ariaLive = variant === "error" ? void 0 : variant === "warning" ? "assertive" : "polite";
   const resolvedIconName = iconName ?? variantIconNames[variant];
-  const iconContent = icon ?? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  const iconContent = icon ?? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     WebIcon,
     {
       name: resolvedIconName,
@@ -13759,7 +13840,7 @@ var Toast = (0, import_react48.forwardRef)(function Toast2(props, ref) {
     }
   );
   const isPrimaryAction = !action || typeof action !== "object" || !("variant" in action) || action.variant === "primary";
-  const actionEl = typeof action === "object" && action !== null && "label" in action ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  const actionEl = typeof action === "object" && action !== null && "label" in action ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     Button,
     {
       variant: isPrimaryAction ? "primary" : "outline",
@@ -13775,7 +13856,7 @@ var Toast = (0, import_react48.forwardRef)(function Toast2(props, ref) {
     borderColor: (0, import_color12.resolveColorTokenValue)(color.border),
     color: (0, import_color12.resolveColorTokenValue)(color.message)
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
     "div",
     {
       ref,
@@ -13788,20 +13869,20 @@ var Toast = (0, import_react48.forwardRef)(function Toast2(props, ref) {
       style: { ...tokenStyle, ...style },
       className: (0, import_clsx98.clsx)(toastStyles.card, className),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { "data-refineui": "toast-icon", className: toastStyles.iconWrap, children: iconContent }),
-        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: toastStyles.contentWrap, children: message != null && message !== "" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: toastStyles.message, children: message }) : null }),
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { "data-refineui": "toast-icon", className: toastStyles.iconWrap, children: iconContent }),
+        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: toastStyles.contentWrap, children: message != null && message !== "" ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: toastStyles.message, children: message }) : null }),
         action != null && actionEl
       ]
     }
   );
 });
 function SwipeableToast({ record, index, swipeDirections, onSwipeStart, onSwipeEnd }) {
-  const toastRef = (0, import_react48.useRef)(null);
-  const dragStartRef = (0, import_react48.useRef)(null);
-  const axisRef = (0, import_react48.useRef)(null);
-  const offsetRef = (0, import_react48.useRef)({ x: 0, y: 0 });
-  const [swiping, setSwiping] = (0, import_react48.useState)(false);
-  const clearSwipeOffset = (0, import_react48.useCallback)(() => {
+  const toastRef = (0, import_react50.useRef)(null);
+  const dragStartRef = (0, import_react50.useRef)(null);
+  const axisRef = (0, import_react50.useRef)(null);
+  const offsetRef = (0, import_react50.useRef)({ x: 0, y: 0 });
+  const [swiping, setSwiping] = (0, import_react50.useState)(false);
+  const clearSwipeOffset = (0, import_react50.useCallback)(() => {
     const el = toastRef.current;
     offsetRef.current = { x: 0, y: 0 };
     if (!el) return;
@@ -13876,7 +13957,7 @@ function SwipeableToast({ record, index, swipeDirections, onSwipeStart, onSwipeE
     clearSwipeOffset();
     onSwipeEnd();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     Toast,
     {
       ref: toastRef,
@@ -13902,8 +13983,8 @@ function Toaster({
   swipeDirections,
   className
 }) {
-  const toasterKeyRef = (0, import_react48.useRef)(/* @__PURE__ */ Symbol("refineui-toaster"));
-  const isPortalOwner = (0, import_react48.useSyncExternalStore)(
+  const toasterKeyRef = (0, import_react50.useRef)(/* @__PURE__ */ Symbol("refineui-toaster"));
+  const isPortalOwner = (0, import_react50.useSyncExternalStore)(
     (onStoreChange) => {
       toasterOwnerListeners.add(onStoreChange);
       return () => toasterOwnerListeners.delete(onStoreChange);
@@ -13911,12 +13992,12 @@ function Toaster({
     () => activeToasterKey === toasterKeyRef.current,
     () => false
   );
-  const [records, setRecords] = (0, import_react48.useState)([]);
-  const timerMapRef = (0, import_react48.useRef)({});
-  const pausedRef = (0, import_react48.useRef)(/* @__PURE__ */ new Set());
-  const rootRef = (0, import_react48.useRef)(null);
-  const itemRefs = (0, import_react48.useRef)({});
-  const [layoutTick, setLayoutTick] = (0, import_react48.useState)(0);
+  const [records, setRecords] = (0, import_react50.useState)([]);
+  const timerMapRef = (0, import_react50.useRef)({});
+  const pausedRef = (0, import_react50.useRef)(/* @__PURE__ */ new Set());
+  const rootRef = (0, import_react50.useRef)(null);
+  const itemRefs = (0, import_react50.useRef)({});
+  const [layoutTick, setLayoutTick] = (0, import_react50.useState)(0);
   const stackGapPx = useToastStackGapPx();
   const resolvedSwipe = swipeDirections ?? DEFAULT_SWIPE_DIRECTIONS;
   useIsomorphicLayoutEffect6(() => {
@@ -13930,13 +14011,13 @@ function Toaster({
       }
     };
   }, []);
-  (0, import_react48.useEffect)(() => {
+  (0, import_react50.useEffect)(() => {
     if (!isPortalOwner) return;
     return subscribeToasts((next) => {
       setRecords(next.slice(0, Math.max(1, maxToasts)));
     });
   }, [isPortalOwner, maxToasts]);
-  (0, import_react48.useEffect)(() => {
+  (0, import_react50.useEffect)(() => {
     if (!isPortalOwner) return;
     for (const rec of records) {
       if (rec.phase === "leaving") continue;
@@ -13958,7 +14039,7 @@ function Toaster({
       }
     }
   }, [isPortalOwner, records]);
-  (0, import_react48.useEffect)(() => {
+  (0, import_react50.useEffect)(() => {
     return () => {
       for (const handle of Object.values(timerMapRef.current)) {
         clearTimeout(handle);
@@ -13984,7 +14065,7 @@ function Toaster({
       li.style.height = `${slotHeight(idx)}px`;
     }
   }, [isPortalOwner, layoutTick, records, stackGapPx]);
-  (0, import_react48.useEffect)(() => {
+  (0, import_react50.useEffect)(() => {
     if (!isPortalOwner) return;
     const root = rootRef.current;
     if (!root) return;
@@ -14018,7 +14099,7 @@ function Toaster({
     return null;
   }
   return (0, import_react_dom6.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
       "ol",
       {
         ref: rootRef,
@@ -14029,7 +14110,7 @@ function Toaster({
         style: {
           ["--refineui-toast-gap"]: `${stackGapPx}px`
         },
-        children: records.map((rec, index) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        children: records.map((rec, index) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
           "li",
           {
             ref: (node) => {
@@ -14043,7 +14124,7 @@ function Toaster({
               ["--refineui-toast-z-index"]: String(STACK_Z_BASE - index),
               ["--refineui-toast-stack-index"]: String(index)
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { "data-refineui": "toast-scale-layer", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { "data-refineui": "toast-scale-layer", children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
               SwipeableToast,
               {
                 record: rec,
@@ -14064,21 +14145,21 @@ function Toaster({
 
 // src/components/Tree/Tree.tsx
 var import_clsx100 = require("clsx");
-var import_react50 = require("react");
+var import_react52 = require("react");
 
 // src/components/Tree/context.ts
-var import_react49 = require("react");
+var import_react51 = require("react");
 var import_tokens31 = require("@refineui/tokens");
 var import_animation8 = require("@refineui/utilities/animation");
 var TREE_PANEL_MS = Number.parseFloat(import_tokens31.semanticInteraction.duration.accordionPanel) / 1e3;
 var TREE_CONTENT_MS = Number.parseFloat(import_tokens31.semanticInteraction.duration.accordionContent) / 1e3;
 var TREE_PANEL_EASE = import_tokens31.semanticInteraction.easing.panel;
 var TREE_CONTENT_EASE = import_tokens31.semanticInteraction.easing.content;
-var TreeContext = (0, import_react49.createContext)(null);
-var TreeItemContext = (0, import_react49.createContext)(null);
+var TreeContext = (0, import_react51.createContext)(null);
+var TreeItemContext = (0, import_react51.createContext)(null);
 function usePrefersReducedMotion2() {
-  const [reduce, setReduce] = (0, import_react49.useState)(false);
-  (0, import_react49.useEffect)(() => {
+  const [reduce, setReduce] = (0, import_react51.useState)(false);
+  (0, import_react51.useEffect)(() => {
     const mql = window.matchMedia((0, import_animation8.getReducedMotionQuery)().replace("@media ", ""));
     const sync = () => setReduce(mql.matches);
     sync();
@@ -14133,7 +14214,7 @@ var treeItemTypo = {
 };
 
 // src/components/Tree/Tree.tsx
-var import_jsx_runtime72 = require("react/jsx-runtime");
+var import_jsx_runtime73 = require("react/jsx-runtime");
 function Tree({
   size = "md",
   defaultExpanded,
@@ -14147,29 +14228,29 @@ function Tree({
   ...props
 }) {
   const reduceMotion = usePrefersReducedMotion2();
-  const [uncontrolledExpanded, setUncontrolledExpanded] = (0, import_react50.useState)(() => toExpandedSet(defaultExpanded));
-  const [uncontrolledSelected, setUncontrolledSelected] = (0, import_react50.useState)(defaultSelected ?? null);
+  const [uncontrolledExpanded, setUncontrolledExpanded] = (0, import_react52.useState)(() => toExpandedSet(defaultExpanded));
+  const [uncontrolledSelected, setUncontrolledSelected] = (0, import_react52.useState)(defaultSelected ?? null);
   const expanded = expandedProp === void 0 ? uncontrolledExpanded : toExpandedSet(expandedProp);
   const selected = selectedProp === void 0 ? uncontrolledSelected : selectedProp;
-  const orderRef = (0, import_react50.useRef)([]);
-  const elMapRef = (0, import_react50.useRef)(/* @__PURE__ */ new Map());
-  const metaMapRef = (0, import_react50.useRef)(/* @__PURE__ */ new Map());
-  const emitExpanded = (0, import_react50.useCallback)(
+  const orderRef = (0, import_react52.useRef)([]);
+  const elMapRef = (0, import_react52.useRef)(/* @__PURE__ */ new Map());
+  const metaMapRef = (0, import_react52.useRef)(/* @__PURE__ */ new Map());
+  const emitExpanded = (0, import_react52.useCallback)(
     (next) => {
       if (expandedProp === void 0) setUncontrolledExpanded(next);
       onExpandedChange?.(Array.from(next));
     },
     [expandedProp, onExpandedChange]
   );
-  const emitSelected = (0, import_react50.useCallback)(
+  const emitSelected = (0, import_react52.useCallback)(
     (next) => {
       if (selectedProp === void 0) setUncontrolledSelected(next);
       onSelectedChange?.(next);
     },
     [onSelectedChange, selectedProp]
   );
-  const isExpanded = (0, import_react50.useCallback)((value) => expanded.has(value), [expanded]);
-  const toggleExpanded = (0, import_react50.useCallback)(
+  const isExpanded = (0, import_react52.useCallback)((value) => expanded.has(value), [expanded]);
+  const toggleExpanded = (0, import_react52.useCallback)(
     (value) => {
       const next = new Set(expanded);
       if (next.has(value)) next.delete(value);
@@ -14178,7 +14259,7 @@ function Tree({
     },
     [emitExpanded, expanded]
   );
-  const expand = (0, import_react50.useCallback)(
+  const expand = (0, import_react52.useCallback)(
     (value) => {
       if (expanded.has(value)) return;
       const next = new Set(expanded);
@@ -14187,7 +14268,7 @@ function Tree({
     },
     [emitExpanded, expanded]
   );
-  const collapse = (0, import_react50.useCallback)(
+  const collapse = (0, import_react52.useCallback)(
     (value) => {
       if (!expanded.has(value)) return;
       const next = new Set(expanded);
@@ -14196,13 +14277,13 @@ function Tree({
     },
     [emitExpanded, expanded]
   );
-  const select = (0, import_react50.useCallback)(
+  const select = (0, import_react52.useCallback)(
     (value) => {
       emitSelected(value);
     },
     [emitSelected]
   );
-  const registerItem = (0, import_react50.useCallback)((value, el, meta) => {
+  const registerItem = (0, import_react52.useCallback)((value, el, meta) => {
     metaMapRef.current.set(value, meta);
     if (!orderRef.current.includes(value)) {
       orderRef.current.push(value);
@@ -14214,10 +14295,10 @@ function Tree({
       orderRef.current = orderRef.current.filter((v) => v !== value);
     }
   }, []);
-  const focusItem = (0, import_react50.useCallback)((value) => {
+  const focusItem = (0, import_react52.useCallback)((value) => {
     elMapRef.current.get(value)?.focus();
   }, []);
-  const visibleValues = (0, import_react50.useCallback)(() => {
+  const visibleValues = (0, import_react52.useCallback)(() => {
     const result = [];
     const walk = (parent) => {
       for (const value of orderRef.current) {
@@ -14231,7 +14312,7 @@ function Tree({
     walk(null);
     return result;
   }, [expanded]);
-  const focusByDelta = (0, import_react50.useCallback)(
+  const focusByDelta = (0, import_react52.useCallback)(
     (currentValue, delta) => {
       const list = visibleValues();
       const idx = list.indexOf(currentValue);
@@ -14241,17 +14322,17 @@ function Tree({
     },
     [focusItem, visibleValues]
   );
-  const focusFirst = (0, import_react50.useCallback)(() => {
+  const focusFirst = (0, import_react52.useCallback)(() => {
     const list = visibleValues();
     if (list[0]) focusItem(list[0]);
   }, [focusItem, visibleValues]);
-  const focusLast = (0, import_react50.useCallback)(() => {
+  const focusLast = (0, import_react52.useCallback)(() => {
     const list = visibleValues();
     const last = list[list.length - 1];
     if (last) focusItem(last);
   }, [focusItem, visibleValues]);
-  const getParent = (0, import_react50.useCallback)((value) => metaMapRef.current.get(value)?.parentValue ?? null, []);
-  const contextValue = (0, import_react50.useMemo)(
+  const getParent = (0, import_react52.useCallback)((value) => metaMapRef.current.get(value)?.parentValue ?? null, []);
+  const contextValue = (0, import_react52.useMemo)(
     () => ({
       size,
       isExpanded,
@@ -14285,7 +14366,7 @@ function Tree({
       toggleExpanded
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(TreeContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(TreeContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
     "ul",
     {
       "data-refineui": "tree",
@@ -14299,21 +14380,21 @@ function Tree({
 
 // src/components/Tree/TreeItem.tsx
 var import_clsx101 = require("clsx");
-var import_react51 = require("react");
-var import_jsx_runtime73 = require("react/jsx-runtime");
+var import_react53 = require("react");
+var import_jsx_runtime74 = require("react/jsx-runtime");
 function TreeItem({ value, disabled = false, className, children, ...props }) {
-  const tree = (0, import_react51.useContext)(TreeContext);
-  const parent = (0, import_react51.useContext)(TreeItemContext);
+  const tree = (0, import_react53.useContext)(TreeContext);
+  const parent = (0, import_react53.useContext)(TreeItemContext);
   if (!tree) throw new Error("TreeItem must be used within Tree.");
-  const [hasBranch, setHasBranch] = (0, import_react51.useState)(false);
-  const uid = (0, import_react51.useId)().replace(/:/g, "");
+  const [hasBranch, setHasBranch] = (0, import_react53.useState)(false);
+  const uid = (0, import_react53.useId)().replace(/:/g, "");
   const depth = parent ? parent.depth + 1 : 0;
   const parentValue = parent?.value ?? null;
   const expanded = tree.isExpanded(value);
   const selected = tree.selected === value;
   const triggerId = `tree-trigger-${uid}-${value}`;
   const groupId = `tree-group-${uid}-${value}`;
-  const itemContext = (0, import_react51.useMemo)(
+  const itemContext = (0, import_react53.useMemo)(
     () => ({
       value,
       depth,
@@ -14328,7 +14409,7 @@ function TreeItem({ value, disabled = false, className, children, ...props }) {
     }),
     [value, depth, parentValue, expanded, selected, disabled, hasBranch, triggerId, groupId]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(TreeItemContext.Provider, { value: itemContext, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(TreeItemContext.Provider, { value: itemContext, children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
     "li",
     {
       "data-refineui": "tree-item",
@@ -14349,18 +14430,18 @@ function TreeItem({ value, disabled = false, className, children, ...props }) {
 
 // src/components/Tree/TreeItemTrigger.tsx
 var import_clsx102 = require("clsx");
-var import_react52 = require("react");
-var import_jsx_runtime74 = require("react/jsx-runtime");
+var import_react54 = require("react");
+var import_jsx_runtime75 = require("react/jsx-runtime");
 function TreeItemTrigger({ className, children, onClick, onKeyDown, ...props }) {
-  const tree = (0, import_react52.useContext)(TreeContext);
-  const item = (0, import_react52.useContext)(TreeItemContext);
+  const tree = (0, import_react54.useContext)(TreeContext);
+  const item = (0, import_react54.useContext)(TreeItemContext);
   if (!tree || !item) throw new Error("TreeItemTrigger must be used within TreeItem.");
   const iconSize = treeIconSize[tree.size];
   const depthIndent = "calc(var(--refineui-spacing-size-large) + var(--refineui-spacing-size-x-small))";
   const mainStyle = {
     paddingInlineStart: item.depth > 0 ? `calc(${depthIndent} * ${item.depth})` : void 0
   };
-  (0, import_react52.useEffect)(() => {
+  (0, import_react54.useEffect)(() => {
     return () => {
       tree.registerItem(item.value, null, {
         parentValue: item.parentValue,
@@ -14436,7 +14517,7 @@ function TreeItemTrigger({ className, children, onClick, onKeyDown, ...props })
         break;
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     "div",
     {
       ref: setRowRef,
@@ -14455,8 +14536,8 @@ function TreeItemTrigger({ className, children, onClick, onKeyDown, ...props })
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { "data-refineui": "tree-item-main", className: treeStyles.rowMain, style: mainStyle, children: [
-        item.hasBranch ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { "data-refineui": "tree-item-main", className: treeStyles.rowMain, style: mainStyle, children: [
+        item.hasBranch ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
           "button",
           {
             type: "button",
@@ -14470,10 +14551,10 @@ function TreeItemTrigger({ className, children, onClick, onKeyDown, ...props })
               item.expanded && treeStyles.chevronExpanded,
               tree.reduceMotion && "transition-none"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(WebIcon, { name: "chevron-right", size: iconSize, color: "currentColor", fallback: "\u203A" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(WebIcon, { name: "chevron-right", size: iconSize, color: "currentColor", fallback: "\u203A" })
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("span", { className: treeStyles.chevronSpacer, "aria-hidden": "true" }),
-        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("span", { className: treeStyles.label, children })
+        ) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: treeStyles.chevronSpacer, "aria-hidden": "true" }),
+        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("span", { className: treeStyles.label, children })
       ] })
     }
   );
@@ -14481,14 +14562,14 @@ function TreeItemTrigger({ className, children, onClick, onKeyDown, ...props })
 
 // src/components/Tree/TreeItemContent.tsx
 var import_clsx103 = require("clsx");
-var import_react53 = require("react");
-var import_jsx_runtime75 = require("react/jsx-runtime");
+var import_react55 = require("react");
+var import_jsx_runtime76 = require("react/jsx-runtime");
 function TreeItemContent({ className, children, ...props }) {
-  const tree = (0, import_react53.useContext)(TreeContext);
-  const item = (0, import_react53.useContext)(TreeItemContext);
+  const tree = (0, import_react55.useContext)(TreeContext);
+  const item = (0, import_react55.useContext)(TreeItemContext);
   if (!tree || !item) throw new Error("TreeItemContent must be used within TreeItem.");
   const { setHasBranch, expanded, groupId, triggerId } = item;
-  (0, import_react53.useLayoutEffect)(() => {
+  (0, import_react55.useLayoutEffect)(() => {
     setHasBranch(true);
     return () => setHasBranch(false);
   }, [setHasBranch]);
@@ -14503,7 +14584,7 @@ function TreeItemContent({ className, children, ...props }) {
     transition: tree.reduceMotion ? void 0 : `opacity ${TREE_CONTENT_MS}s ${TREE_CONTENT_EASE}, transform ${TREE_CONTENT_MS}s ${TREE_CONTENT_EASE}`,
     pointerEvents: expanded ? void 0 : "none"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
     "div",
     {
       ref: (el) => {
@@ -14514,7 +14595,7 @@ function TreeItemContent({ className, children, ...props }) {
       "data-refineui": "tree-item-panel",
       "aria-hidden": !expanded,
       style: gridStyle,
-      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: treeStyles.panel, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: treeStyles.panelInner, style: innerMotionStyle, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: treeStyles.panel, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: treeStyles.panelInner, style: innerMotionStyle, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
         "ul",
         {
           id: groupId,
@@ -14532,9 +14613,9 @@ function TreeItemContent({ className, children, ...props }) {
 
 // src/components/Tooltip/Tooltip.tsx
 var import_clsx105 = require("clsx");
-var import_react54 = require("react");
+var import_react56 = require("react");
 var import_color13 = require("@refineui/utilities/color");
-var import_react55 = require("@refineui/utilities/react");
+var import_react57 = require("@refineui/utilities/react");
 
 // src/components/Tooltip/style.ts
 var import_tokens33 = require("@refineui/tokens");
@@ -14638,7 +14719,7 @@ function tooltipBeakRotateDeg(position) {
 }
 
 // src/components/Tooltip/Tooltip.tsx
-var import_jsx_runtime76 = require("react/jsx-runtime");
+var import_jsx_runtime77 = require("react/jsx-runtime");
 function Tooltip({
   trigger,
   content,
@@ -14651,10 +14732,10 @@ function Tooltip({
   className,
   ...props
 }) {
-  const [innerOpen, setInnerOpen] = (0, import_react54.useState)(defaultOpen);
+  const [innerOpen, setInnerOpen] = (0, import_react56.useState)(defaultOpen);
   const open = ctrlOpen !== void 0 ? ctrlOpen : innerOpen;
-  const tooltipId = (0, import_react54.useId)();
-  const showTimer = (0, import_react54.useRef)(null);
+  const tooltipId = (0, import_react56.useId)();
+  const showTimer = (0, import_react56.useRef)(null);
   const setOpen = (next) => {
     if (ctrlOpen === void 0) setInnerOpen(next);
     onOpenChange?.(next);
@@ -14681,11 +14762,11 @@ function Tooltip({
   const beakWrapStyle = tooltipBeakWrapperStyle(position, align);
   const beakRot = tooltipBeakRotateDeg(position);
   const describedBy = open ? tooltipId : void 0;
-  const mergeEl = (0, import_react55.getMergeableTriggerChild)(trigger);
+  const mergeEl = (0, import_react57.getMergeableTriggerChild)(trigger);
   let triggerNode;
   if (mergeEl != null) {
-    triggerNode = /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
-      import_react55.Slot,
+    triggerNode = /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      import_react57.Slot,
       {
         "aria-describedby": describedBy,
         onMouseEnter: scheduleShow,
@@ -14701,7 +14782,7 @@ function Tooltip({
       }
     );
   } else {
-    triggerNode = /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+    triggerNode = /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
       "span",
       {
         tabIndex: 0,
@@ -14718,16 +14799,16 @@ function Tooltip({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { "data-refineui": "tooltip", className: (0, import_clsx105.clsx)(tooltipStyles.root, className), ...props, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { "data-refineui": "tooltip", className: (0, import_clsx105.clsx)(tooltipStyles.root, className), ...props, children: [
     triggerNode,
-    open && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: tooltipStyles.floating, style: floatingStyle, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: tooltipStyles.panelWrap, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: tooltipStyles.floating, style: floatingStyle, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: tooltipStyles.panelWrap, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
         "div",
         {
           className: tooltipStyles.beakWrap,
           style: { ...beakWrapStyle, width: TOOLTIP_BEAK_W, height: TOOLTIP_BEAK_H },
           "aria-hidden": true,
-          children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
             "div",
             {
               style: {
@@ -14736,7 +14817,7 @@ function Tooltip({
                 transform: `rotate(${beakRot}deg)`,
                 transformOrigin: "center center"
               },
-              children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
                 "svg",
                 {
                   width: TOOLTIP_BEAK_W,
@@ -14746,8 +14827,8 @@ function Tooltip({
                   xmlns: "http://www.w3.org/2000/svg",
                   style: { display: "block" },
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("polygon", { points: "8,0 0,8 16,8", fill: borderCol }),
-                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("polygon", { points: "8,2 2,8 14,8", fill: bg })
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("polygon", { points: "8,0 0,8 16,8", fill: borderCol }),
+                    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("polygon", { points: "8,2 2,8 14,8", fill: bg })
                   ]
                 }
               )
@@ -14755,7 +14836,7 @@ function Tooltip({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
         "div",
         {
           id: tooltipId,
@@ -14778,7 +14859,7 @@ function Tooltip({
 
 // src/components/Chart/Chart.tsx
 var import_clsx107 = require("clsx");
-var import_react56 = require("react");
+var import_react58 = require("react");
 var import_tokens35 = require("@refineui/tokens");
 var import_color14 = require("@refineui/utilities/color");
 
@@ -15005,10 +15086,10 @@ function formatAxisTick(value) {
 }
 
 // src/components/Chart/Chart.tsx
-var import_jsx_runtime77 = require("react/jsx-runtime");
-var ChartContext = (0, import_react56.createContext)(null);
+var import_jsx_runtime78 = require("react/jsx-runtime");
+var ChartContext = (0, import_react58.createContext)(null);
 function useChartContext(component) {
-  const value = (0, import_react56.useContext)(ChartContext);
+  const value = (0, import_react58.useContext)(ChartContext);
   if (!value) throw new Error(`${component} must be used within Chart.`);
   return value;
 }
@@ -15038,15 +15119,15 @@ function itemState(index, hoverIndex, selectedIndex) {
   return "default";
 }
 function isChartTooltipElement(node) {
-  return (0, import_react56.isValidElement)(node) && node.type === ChartTooltip;
+  return (0, import_react58.isValidElement)(node) && node.type === ChartTooltip;
 }
 function Chart({ className, children, ...props }) {
-  const [hoverIndex, setHoverIndex] = (0, import_react56.useState)(null);
-  const [selectedIndex, setSelectedIndex] = (0, import_react56.useState)(null);
-  const [pointer, setPointer] = (0, import_react56.useState)(null);
-  const [labels, setLabels] = (0, import_react56.useState)([]);
-  const [series, setSeries] = (0, import_react56.useState)(null);
-  const context = (0, import_react56.useMemo)(
+  const [hoverIndex, setHoverIndex] = (0, import_react58.useState)(null);
+  const [selectedIndex, setSelectedIndex] = (0, import_react58.useState)(null);
+  const [pointer, setPointer] = (0, import_react58.useState)(null);
+  const [labels, setLabels] = (0, import_react58.useState)([]);
+  const [series, setSeries] = (0, import_react58.useState)(null);
+  const context = (0, import_react58.useMemo)(
     () => ({
       hoverIndex,
       selectedIndex,
@@ -15061,7 +15142,7 @@ function Chart({ className, children, ...props }) {
     }),
     [hoverIndex, selectedIndex, pointer, labels, series]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(ChartContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(ChartContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       "data-refineui": "chart",
@@ -15072,7 +15153,7 @@ function Chart({ className, children, ...props }) {
   ) });
 }
 function ChartBody({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       "data-refineui": "chart-body",
@@ -15082,7 +15163,7 @@ function ChartBody({ className, ...props }) {
   );
 }
 function ChartContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       "data-refineui": "chart-content",
@@ -15107,7 +15188,7 @@ function ChartHitArea() {
     setHoverIndex(hoverIndexFromPlotX(next.x, count, series.align));
     return next;
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "rect",
     {
       "data-refineui": "chart-hit-area",
@@ -15141,11 +15222,11 @@ function ChartPlot({
   const { pointer, selectedIndex } = useChartContext("ChartPlot");
   const svgChildren = [];
   const tooltipNodes = [];
-  import_react56.Children.forEach(children, (child) => {
+  import_react58.Children.forEach(children, (child) => {
     if (isChartTooltipElement(child)) tooltipNodes.push(child);
     else svgChildren.push(child);
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
     "div",
     {
       "data-refineui": "chart-plot-frame",
@@ -15154,7 +15235,7 @@ function ChartPlot({
       className: (0, import_clsx107.clsx)(chartStyles.plotFrame, className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
           "svg",
           {
             "data-refineui": "chart-plot",
@@ -15165,7 +15246,7 @@ function ChartPlot({
             className: chartStyles.plot,
             children: [
               svgChildren,
-              /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(ChartHitArea, {})
+              /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(ChartHitArea, {})
             ]
           }
         ),
@@ -15183,7 +15264,7 @@ function ChartTooltip({ className, children, style, ...props }) {
   const flipY = pointer.y < CHART_PLOT_PADDING_TOP + plotHeight() * CHART_TOOLTIP_FLIP_Y;
   const offsetX = flipX ? "calc(-100% - var(--refineui-spacing-size-small))" : "var(--refineui-spacing-size-small)";
   const offsetY = flipY ? "var(--refineui-spacing-size-small)" : "calc(-100% - var(--refineui-spacing-size-x-small))";
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       "data-refineui": "chart-tooltip",
@@ -15196,9 +15277,9 @@ function ChartTooltip({ className, children, style, ...props }) {
         ...style
       },
       ...props,
-      children: children ?? /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
-        label ? /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: chartStyles.tooltipLabel, children: label }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("span", { className: chartStyles.tooltipValue, children: formatAxisTick(value) })
+      children: children ?? /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_jsx_runtime78.Fragment, { children: [
+        label ? /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: chartStyles.tooltipLabel, children: label }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("span", { className: chartStyles.tooltipValue, children: formatAxisTick(value) })
       ] })
     }
   );
@@ -15213,14 +15294,14 @@ function ChartYAxisLabels({
 }) {
   const scaleMax = resolveScale(values, max);
   const ticks = yAxisTicks(scaleMax, lines).slice().reverse();
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       "data-refineui": "chart-y-axis",
       className: (0, import_clsx107.clsx)(chartStyles.yAxis, className),
       "aria-hidden": true,
       ...props,
-      children: ticks.map((tick) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      children: ticks.map((tick) => /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
         "span",
         {
           className: chartStyles.yAxisTick,
@@ -15243,12 +15324,12 @@ function ChartGrid({
   const ticks = yAxisTicks(scaleMax, lines);
   const gridColor = gridStroke();
   const baselineColor = gridBaselineStroke();
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("g", { "data-refineui": "chart-grid", className, ...props, children: ticks.map((tick, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("g", { "data-refineui": "chart-grid", className, ...props, children: ticks.map((tick, index) => {
     const y = gridLineY(scaleMax, tick);
     const isBaseline = index === 0;
     const isTop = index === ticks.length - 1;
     if (isTop) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
       "line",
       {
         x1: CHART_PLOT_PADDING_X,
@@ -15280,13 +15361,13 @@ function ChartBars({
   const barRadius = Math.min(CHART_BAR_RADIUS, barWidth / 2);
   const baselineY = plotBaselineY();
   const trackHeight = plotHeight();
-  (0, import_react56.useLayoutEffect)(() => {
+  (0, import_react58.useLayoutEffect)(() => {
     setSeries({ values, seriesColor, max, align: "bar" });
   }, [values, seriesColor, max, setSeries]);
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { "data-refineui": "chart-bars", "data-series-color": seriesColor, className, ...props, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("g", { "data-refineui": "chart-bars", "data-series-color": seriesColor, className, ...props, children: [
     showTrack ? values.map((_, index) => {
       const x = barX(index, values.length);
-      return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
         "path",
         {
           "data-refineui": "chart-bar-track",
@@ -15308,7 +15389,7 @@ function ChartBars({
       const height = baselineY - y;
       if (height <= 0) return null;
       const state = itemState(index, hoverIndex, selectedIndex);
-      return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
         "path",
         {
           "data-refineui": "chart-bar",
@@ -15331,20 +15412,20 @@ function ChartLine({
   ...props
 }) {
   const { hoverIndex, selectedIndex, setSeries } = useChartContext("ChartLine");
-  const gradientId = (0, import_react56.useId)().replace(/:/g, "");
+  const gradientId = (0, import_react58.useId)().replace(/:/g, "");
   const scaleMax = resolveChartScale(values, max);
   const stroke = seriesColorToken(seriesColor);
   const coords = linePointCoords(values, scaleMax);
   const baselineY = plotBaselineY();
   const pointRing = pointStrokeColor();
   const linePath = monotoneLinePath(coords);
-  (0, import_react56.useLayoutEffect)(() => {
+  (0, import_react58.useLayoutEffect)(() => {
     setSeries({ values, seriesColor, max, align: "line" });
   }, [values, seriesColor, max, setSeries]);
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("g", { "data-refineui": "chart-line", "data-series-color": seriesColor, className, ...props, children: [
-    showArea && coords.length > 1 ? /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_jsx_runtime77.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("g", { "data-refineui": "chart-line", "data-series-color": seriesColor, className, ...props, children: [
+    showArea && coords.length > 1 ? /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(import_jsx_runtime78.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
           "stop",
           {
             offset: "0%",
@@ -15352,9 +15433,9 @@ function ChartLine({
             stopOpacity: import_tokens35.opacities.opacityDisabled
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("stop", { offset: "100%", stopColor: stroke, stopOpacity: "0" })
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("stop", { offset: "100%", stopColor: stroke, stopOpacity: "0" })
       ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
         "path",
         {
           "data-refineui": "chart-line-area",
@@ -15363,7 +15444,7 @@ function ChartLine({
         }
       )
     ] }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
       "path",
       {
         "data-refineui": "chart-line-stroke",
@@ -15381,7 +15462,7 @@ function ChartLine({
       const state = itemState(index, hoverIndex, selectedIndex);
       const visible = showPoints || state !== "default";
       if (!visible) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
         "circle",
         {
           "data-refineui": "chart-point",
@@ -15407,10 +15488,10 @@ function ChartAxisLabels({
   const { hoverIndex, selectedIndex, setLabels } = useChartContext("ChartAxisLabels");
   const count = labels.length;
   const centerAt = align === "line" ? linePointCenterRatio : barBandCenterRatio;
-  (0, import_react56.useLayoutEffect)(() => {
+  (0, import_react58.useLayoutEffect)(() => {
     setLabels(labels);
   }, [labels, setLabels]);
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "div",
     {
       "data-refineui": "chart-axis-labels",
@@ -15419,7 +15500,7 @@ function ChartAxisLabels({
       ...props,
       children: labels.map((label, index) => {
         const state = itemState(index, hoverIndex, selectedIndex);
-        return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
           "span",
           {
             "data-state": state,
@@ -15437,7 +15518,7 @@ function ChartAxisLabels({
   );
 }
 function ChartLegend({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
     "ul",
     {
       "data-refineui": "chart-legend",
@@ -15453,7 +15534,7 @@ function ChartLegendItem({
   style,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
     "li",
     {
       "data-refineui": "chart-legend-item",
@@ -15461,7 +15542,7 @@ function ChartLegendItem({
       className: (0, import_clsx107.clsx)(chartStyles.legendItem, className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
           "span",
           {
             "aria-hidden": true,
@@ -15476,26 +15557,26 @@ function ChartLegendItem({
 }
 
 // src/components/Slot/Slot.tsx
-var import_react57 = require("@refineui/utilities/react");
+var import_react59 = require("@refineui/utilities/react");
 
 // src/components/Collapsible/Collapsible.tsx
-var import_react59 = require("react");
+var import_react61 = require("react");
 var import_clsx108 = require("clsx");
-var import_react60 = require("@refineui/utilities/react");
+var import_react62 = require("@refineui/utilities/react");
 
 // src/components/Collapsible/context.ts
-var import_react58 = require("react");
+var import_react60 = require("react");
 var import_tokens36 = require("@refineui/tokens");
 var import_animation9 = require("@refineui/utilities/animation");
-var CollapsibleContext = (0, import_react58.createContext)(null);
+var CollapsibleContext = (0, import_react60.createContext)(null);
 function useCollapsibleContext(part) {
-  const value = (0, import_react58.useContext)(CollapsibleContext);
+  const value = (0, import_react60.useContext)(CollapsibleContext);
   if (!value) throw new Error(`${part} must be used within Collapsible`);
   return value;
 }
 function usePrefersReducedMotion3() {
-  const [reduce, setReduce] = (0, import_react58.useState)(false);
-  (0, import_react58.useEffect)(() => {
+  const [reduce, setReduce] = (0, import_react60.useState)(false);
+  (0, import_react60.useEffect)(() => {
     const mql = window.matchMedia((0, import_animation9.getReducedMotionQuery)().replace("@media ", ""));
     const sync = () => setReduce(mql.matches);
     sync();
@@ -15515,18 +15596,18 @@ var collapsibleStyles = {
 };
 
 // src/components/Collapsible/Collapsible.tsx
-var import_jsx_runtime78 = require("react/jsx-runtime");
-var Collapsible = (0, import_react59.forwardRef)(function Collapsible2({ open: openProp, defaultOpen = false, onOpenChange, asChild = false, className, children, ...props }, ref) {
-  const [uncontrolled, setUncontrolled] = (0, import_react59.useState)(defaultOpen);
+var import_jsx_runtime79 = require("react/jsx-runtime");
+var Collapsible = (0, import_react61.forwardRef)(function Collapsible2({ open: openProp, defaultOpen = false, onOpenChange, asChild = false, className, children, ...props }, ref) {
+  const [uncontrolled, setUncontrolled] = (0, import_react61.useState)(defaultOpen);
   const open = openProp ?? uncontrolled;
-  const reactId = (0, import_react59.useId)();
+  const reactId = (0, import_react61.useId)();
   const reduceMotion = usePrefersReducedMotion3();
-  const toggle = (0, import_react59.useCallback)(() => {
+  const toggle = (0, import_react61.useCallback)(() => {
     const next = !(openProp ?? uncontrolled);
     if (openProp === void 0) setUncontrolled(next);
     onOpenChange?.(next);
   }, [onOpenChange, openProp, uncontrolled]);
-  const contextValue = (0, import_react59.useMemo)(
+  const contextValue = (0, import_react61.useMemo)(
     () => ({
       open,
       toggle,
@@ -15543,9 +15624,9 @@ var Collapsible = (0, import_react59.forwardRef)(function Collapsible2({ open: o
     "data-refineui": "collapsible",
     className
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(CollapsibleContext.Provider, { value: contextValue, children: asChild ? /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react60.Slot, { ...shared, children }) : /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { ...shared, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(CollapsibleContext.Provider, { value: contextValue, children: asChild ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_react62.Slot, { ...shared, children }) : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { ...shared, children }) });
 });
-var CollapsibleTrigger = (0, import_react59.forwardRef)(
+var CollapsibleTrigger = (0, import_react61.forwardRef)(
   function CollapsibleTrigger2({
     asChild = false,
     onClick,
@@ -15572,8 +15653,8 @@ var CollapsibleTrigger = (0, import_react59.forwardRef)(
         if (!event.defaultPrevented) toggle();
       }
     };
-    if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react60.Slot, { ...shared, children });
-    return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+    if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_react62.Slot, { ...shared, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
       Button,
       {
         ...shared,
@@ -15587,7 +15668,7 @@ var CollapsibleTrigger = (0, import_react59.forwardRef)(
     );
   }
 );
-var CollapsibleContent = (0, import_react59.forwardRef)(
+var CollapsibleContent = (0, import_react61.forwardRef)(
   function CollapsibleContent2({ className, children, style, ...props }, ref) {
     const { open, contentId, triggerId, reduceMotion } = useCollapsibleContext("CollapsibleContent");
     const gridStyle = {
@@ -15602,7 +15683,7 @@ var CollapsibleContent = (0, import_react59.forwardRef)(
       pointerEvents: open ? void 0 : "none",
       ...style
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
       "div",
       {
         ...props,
@@ -15614,26 +15695,26 @@ var CollapsibleContent = (0, import_react59.forwardRef)(
         "data-state": open ? "open" : "closed",
         "data-refineui": "collapsible-content",
         style: gridStyle,
-        children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: collapsibleStyles.panelOuter, children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("div", { className: (0, import_clsx108.clsx)(className), style: innerMotionStyle, children }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: collapsibleStyles.panelOuter, children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: (0, import_clsx108.clsx)(className), style: innerMotionStyle, children }) })
       }
     );
   }
 );
 
 // src/components/ContextMenu/ContextMenu.tsx
-var import_react61 = require("react");
+var import_react63 = require("react");
 var import_react_dom7 = require("react-dom");
 var import_clsx109 = require("clsx");
 var import_tokens37 = require("@refineui/tokens");
 var import_animation10 = require("@refineui/utilities/animation");
-var import_react62 = require("@refineui/utilities/react");
-var import_jsx_runtime79 = require("react/jsx-runtime");
+var import_react64 = require("@refineui/utilities/react");
+var import_jsx_runtime80 = require("react/jsx-runtime");
 var MENU_ATTR = "data-refineui-context-menu";
 var CLOSE_MS = (0, import_animation10.motionMsToNumber)(import_tokens37.semanticInteraction.duration.normal);
-var MenuContext2 = (0, import_react61.createContext)(null);
-var SubContext = (0, import_react61.createContext)(null);
+var MenuContext2 = (0, import_react63.createContext)(null);
+var SubContext = (0, import_react63.createContext)(null);
 function useMenu() {
-  const value = (0, import_react61.useContext)(MenuContext2);
+  const value = (0, import_react63.useContext)(MenuContext2);
   if (!value) throw new Error("Context menu parts must be used within ContextMenu");
   return value;
 }
@@ -15650,29 +15731,29 @@ function placeInView(element, x, y) {
 }
 function ContextMenu({ modal = true, onOpenChange, children }) {
   void modal;
-  const [open, setOpen] = (0, import_react61.useState)(false);
-  const [point, setPoint] = (0, import_react61.useState)({ x: 0, y: 0 });
-  const openRef = (0, import_react61.useRef)(false);
-  const onOpenChangeRef = (0, import_react61.useRef)(onOpenChange);
+  const [open, setOpen] = (0, import_react63.useState)(false);
+  const [point, setPoint] = (0, import_react63.useState)({ x: 0, y: 0 });
+  const openRef = (0, import_react63.useRef)(false);
+  const onOpenChangeRef = (0, import_react63.useRef)(onOpenChange);
   openRef.current = open;
   onOpenChangeRef.current = onOpenChange;
-  const close = (0, import_react61.useCallback)(() => {
+  const close = (0, import_react63.useCallback)(() => {
     if (!openRef.current) return;
     openRef.current = false;
     setOpen(false);
     onOpenChangeRef.current?.(false);
   }, []);
-  const openAt = (0, import_react61.useCallback)((x, y) => {
+  const openAt = (0, import_react63.useCallback)((x, y) => {
     setPoint({ x, y });
     const wasOpen = openRef.current;
     openRef.current = true;
     setOpen(true);
     if (!wasOpen) onOpenChangeRef.current?.(true);
   }, []);
-  const value = (0, import_react61.useMemo)(() => ({ open, point, openAt, close }), [open, point, openAt, close]);
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(MenuContext2.Provider, { value, children });
+  const value = (0, import_react63.useMemo)(() => ({ open, point, openAt, close }), [open, point, openAt, close]);
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(MenuContext2.Provider, { value, children });
 }
-var ContextMenuTrigger = (0, import_react61.forwardRef)(function ContextMenuTrigger2({ asChild = false, onContextMenu, children, ...props }, ref) {
+var ContextMenuTrigger = (0, import_react63.forwardRef)(function ContextMenuTrigger2({ asChild = false, onContextMenu, children, ...props }, ref) {
   const { openAt } = useMenu();
   const shared = {
     ...props,
@@ -15685,18 +15766,18 @@ var ContextMenuTrigger = (0, import_react61.forwardRef)(function ContextMenuTrig
       openAt(event.clientX, event.clientY);
     }
   };
-  if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_react62.Slot, { ...shared, children });
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { ...shared, className: (0, import_clsx109.clsx)(menuStyles.triggerFallback, props.className), children });
+  if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_react64.Slot, { ...shared, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { ...shared, className: (0, import_clsx109.clsx)(menuStyles.triggerFallback, props.className), children });
 });
 function ContextMenuPortal({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_jsx_runtime79.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_jsx_runtime80.Fragment, { children });
 }
-var ContextMenuContent = (0, import_react61.forwardRef)(function ContextMenuContent2({ className, style, onPointerDown, children, ...props }, ref) {
+var ContextMenuContent = (0, import_react63.forwardRef)(function ContextMenuContent2({ className, style, onPointerDown, children, ...props }, ref) {
   const { open, point, close } = useMenu();
-  const localRef = (0, import_react61.useRef)(null);
-  const [shouldRender, setShouldRender] = (0, import_react61.useState)(open);
-  const [isClosing, setIsClosing] = (0, import_react61.useState)(false);
-  (0, import_react61.useEffect)(() => {
+  const localRef = (0, import_react63.useRef)(null);
+  const [shouldRender, setShouldRender] = (0, import_react63.useState)(open);
+  const [isClosing, setIsClosing] = (0, import_react63.useState)(false);
+  (0, import_react63.useEffect)(() => {
     if (open) {
       setShouldRender(true);
       setIsClosing(false);
@@ -15710,11 +15791,11 @@ var ContextMenuContent = (0, import_react61.forwardRef)(function ContextMenuCont
     }, CLOSE_MS);
     return () => window.clearTimeout(timeout);
   }, [open, shouldRender]);
-  (0, import_react61.useLayoutEffect)(() => {
+  (0, import_react63.useLayoutEffect)(() => {
     if (!shouldRender || !localRef.current) return;
     placeInView(localRef.current, point.x, point.y);
   }, [shouldRender, point.x, point.y]);
-  (0, import_react61.useEffect)(() => {
+  (0, import_react63.useEffect)(() => {
     if (!open) return;
     const onKey = (event) => {
       if (event.key === "Escape") close();
@@ -15733,7 +15814,7 @@ var ContextMenuContent = (0, import_react61.forwardRef)(function ContextMenuCont
   }, [open, close]);
   if (!shouldRender || typeof document === "undefined") return null;
   return (0, import_react_dom7.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
       "div",
       {
         ...props,
@@ -15760,7 +15841,7 @@ var ContextMenuContent = (0, import_react61.forwardRef)(function ContextMenuCont
           onPointerDown?.(event);
         },
         onContextMenu: (event) => event.preventDefault(),
-        children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { role: "menu", "data-refineui": "menu", className: (0, import_clsx109.clsx)(menuStyles.list, className), children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { role: "menu", "data-refineui": "menu", className: (0, import_clsx109.clsx)(menuStyles.list, className), children })
       }
     ),
     document.body
@@ -15777,11 +15858,11 @@ function runSelect(onSelect, close, disabled) {
   onSelect?.(selectEvent);
   if (!selectEvent.defaultPrevented) close();
 }
-var ContextMenuItem = (0, import_react61.forwardRef)(function ContextMenuItem2({ disabled = false, description, shortcut, startIcon, endIcon, state = "default", onSelect, className, onClick, onKeyDown, children, ...props }, ref) {
+var ContextMenuItem = (0, import_react63.forwardRef)(function ContextMenuItem2({ disabled = false, description, shortcut, startIcon, endIcon, state = "default", onSelect, className, onClick, onKeyDown, children, ...props }, ref) {
   const { close } = useMenu();
   const isDisabled = disabled || state === "disabled";
   const slotted = startIcon != null || description != null || shortcut != null || endIcon != null;
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
     "button",
     {
       ref,
@@ -15807,8 +15888,8 @@ var ContextMenuItem = (0, import_react61.forwardRef)(function ContextMenuItem2({
           runSelect(onSelect, close, isDisabled);
         }
       },
-      children: slotted ? /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("span", { className: menuStyles.row, children: [
-        startIcon ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+      children: slotted ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: menuStyles.row, children: [
+        startIcon ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
           "span",
           {
             className: menuStyles.iconWrap,
@@ -15816,13 +15897,13 @@ var ContextMenuItem = (0, import_react61.forwardRef)(function ContextMenuItem2({
             children: startIcon
           }
         ) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("span", { className: menuStyles.textCol, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: menuStyles.title, children }),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: (0, import_clsx109.clsx)(menuStyles.description, isDisabled ? menuStyles.descriptionDisabled : menuStyles.descriptionEnabled), children: description }) : null
+        /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: menuStyles.textCol, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: menuStyles.title, children }),
+          description ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: (0, import_clsx109.clsx)(menuStyles.description, isDisabled ? menuStyles.descriptionDisabled : menuStyles.descriptionEnabled), children: description }) : null
         ] }),
-        (shortcut || endIcon) && /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("span", { className: menuStyles.rightWrap, children: [
-          shortcut ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: menuStyles.shortcut, children: shortcut }) : null,
-          endIcon ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+        (shortcut || endIcon) && /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: menuStyles.rightWrap, children: [
+          shortcut ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: menuStyles.shortcut, children: shortcut }) : null,
+          endIcon ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
             "span",
             {
               className: menuStyles.iconWrap,
@@ -15831,13 +15912,13 @@ var ContextMenuItem = (0, import_react61.forwardRef)(function ContextMenuItem2({
             }
           ) : null
         ] })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: menuStyles.row, children })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: menuStyles.row, children })
     }
   );
 });
-var ContextMenuSeparator = (0, import_react61.forwardRef)(
+var ContextMenuSeparator = (0, import_react63.forwardRef)(
   function ContextMenuSeparator2({ className, ...props }, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
       "div",
       {
         ref,
@@ -15847,24 +15928,24 @@ var ContextMenuSeparator = (0, import_react61.forwardRef)(
         ...{ [MENU_ATTR]: "" },
         className: (0, import_clsx109.clsx)(menuStyles.dividerWrap, className),
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: menuStyles.dividerLine })
+        children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: menuStyles.dividerLine })
       }
     );
   }
 );
 function ContextMenuLabel({ className, children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { "data-refineui": "menu-label", className: (0, import_clsx109.clsx)(menuStyles.section, className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: menuStyles.sectionText, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { "data-refineui": "menu-label", className: (0, import_clsx109.clsx)(menuStyles.section, className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: menuStyles.sectionText, children }) });
 }
 function ContextMenuSub({ children }) {
-  const [open, setOpen] = (0, import_react61.useState)(false);
-  const triggerRef = (0, import_react61.useRef)(null);
-  const timer = (0, import_react61.useRef)(null);
+  const [open, setOpen] = (0, import_react63.useState)(false);
+  const triggerRef = (0, import_react63.useRef)(null);
+  const timer = (0, import_react63.useRef)(null);
   const clear = () => {
     if (timer.current != null) window.clearTimeout(timer.current);
     timer.current = null;
   };
-  (0, import_react61.useEffect)(() => clear, []);
-  const value = (0, import_react61.useMemo)(
+  (0, import_react63.useEffect)(() => clear, []);
+  const value = (0, import_react63.useMemo)(
     () => ({
       open,
       triggerRef,
@@ -15879,14 +15960,14 @@ function ContextMenuSub({ children }) {
     }),
     [open]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(SubContext.Provider, { value, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SubContext.Provider, { value, children });
 }
 function useSub2() {
-  const value = (0, import_react61.useContext)(SubContext);
+  const value = (0, import_react63.useContext)(SubContext);
   if (!value) throw new Error("ContextMenuSubTrigger must be used within ContextMenuSub");
   return value;
 }
-var ContextMenuSubTrigger = (0, import_react61.forwardRef)(
+var ContextMenuSubTrigger = (0, import_react63.forwardRef)(
   function ContextMenuSubTrigger2({ asChild = false, description, startIcon, onMouseEnter, onMouseLeave, onClick, className, children, ...props }, ref) {
     const sub = useSub2();
     const shared = {
@@ -15922,9 +16003,9 @@ var ContextMenuSubTrigger = (0, import_react61.forwardRef)(
         if (!event.defaultPrevented) sub.show();
       }
     };
-    if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_react62.Slot, { ...shared, children });
-    return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("button", { ...shared, children: /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("span", { className: menuStyles.row, children: [
-      startIcon ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+    if (asChild) return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_react64.Slot, { ...shared, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("button", { ...shared, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: menuStyles.row, children: [
+      startIcon ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
         "span",
         {
           className: menuStyles.iconWrap,
@@ -15932,27 +16013,27 @@ var ContextMenuSubTrigger = (0, import_react61.forwardRef)(
           children: startIcon
         }
       ) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("span", { className: menuStyles.textCol, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: menuStyles.title, children }),
-        description ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: (0, import_clsx109.clsx)(menuStyles.description, menuStyles.descriptionEnabled), children: description }) : null
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("span", { className: menuStyles.textCol, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: menuStyles.title, children }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: (0, import_clsx109.clsx)(menuStyles.description, menuStyles.descriptionEnabled), children: description }) : null
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: menuStyles.rightWrap, children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: menuStyles.rightWrap, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
         "span",
         {
           className: menuStyles.iconWrap,
           style: { width: import_tokens37.iconSizes.small, minWidth: import_tokens37.iconSizes.small, height: import_tokens37.iconSizes.small },
-          children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(WebIcon, { name: "chevron-right", size: import_tokens37.iconSizes.small, color: "currentColor", "aria-hidden": true })
+          children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(WebIcon, { name: "chevron-right", size: import_tokens37.iconSizes.small, color: "currentColor", "aria-hidden": true })
         }
       ) })
     ] }) });
   }
 );
-var ContextMenuSubContent = (0, import_react61.forwardRef)(
+var ContextMenuSubContent = (0, import_react63.forwardRef)(
   function ContextMenuSubContent2({ className, style, onPointerDown, onMouseEnter, onMouseLeave, ...props }, ref) {
     const sub = useSub2();
-    const localRef = (0, import_react61.useRef)(null);
-    const [side, setSide] = (0, import_react61.useState)("right");
-    (0, import_react61.useLayoutEffect)(() => {
+    const localRef = (0, import_react63.useRef)(null);
+    const [side, setSide] = (0, import_react63.useState)("right");
+    (0, import_react63.useLayoutEffect)(() => {
       const trigger = sub.triggerRef.current;
       const element = localRef.current;
       if (!sub.open || !trigger || !element) return;
@@ -15970,7 +16051,7 @@ var ContextMenuSubContent = (0, import_react61.forwardRef)(
     }, [sub.open, sub.triggerRef]);
     if (!sub.open || typeof document === "undefined") return null;
     return (0, import_react_dom7.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
         "div",
         {
           ...props,
@@ -16238,6 +16319,8 @@ var ContextMenuSubContent = (0, import_react61.forwardRef)(
   SidebarPeekInset,
   SidebarPeekPanel,
   SidebarPeekPin,
+  SidebarProvider,
+  SidebarTrigger,
   Skeleton,
   Slider,
   Slot,
@@ -16295,6 +16378,7 @@ var ContextMenuSubContent = (0, import_react61.forwardRef)(
   semanticTextClass,
   sizedComponentTextClass,
   toast,
+  useSidebar,
   useSidebarPeek
 });
 //# sourceMappingURL=index.cjs.map