diff --git a/.changeset/lovely-suits-divide.md b/.changeset/lovely-suits-divide.md
new file mode 100644
index 0000000..26b7937
--- /dev/null
+++ b/.changeset/lovely-suits-divide.md
@@ -0,0 +1,5 @@
+---
+"react-flexy-panels": patch
+---
+
+feat: allow resize abort onPreResize
diff --git a/apps/docs/src/components/FlexyHandle.tsx b/apps/docs/src/components/FlexyHandle.tsx
index 33f7cfb..0c78b2a 100644
--- a/apps/docs/src/components/FlexyHandle.tsx
+++ b/apps/docs/src/components/FlexyHandle.tsx
@@ -1,8 +1,8 @@
 import { cn } from "@rlx-widgets/base";
 import { GripVerticalIcon } from "lucide-react";
-import { FlexyPanelHandle } from "react-flexy-panels";
+import { FlexyPanelHandle, OnPreResizeFunction } from "react-flexy-panels";
 
-export const FlexyHandle = ({ withHandle }: { withHandle?: boolean }) => {
+export const FlexyHandle = ({ withHandle, onPreResize }: { withHandle?: boolean, onPreResize?: OnPreResizeFunction }) => {
   return (
     <FlexyPanelHandle
       className={cn(
@@ -10,6 +10,7 @@ export const FlexyHandle = ({ withHandle }: { withHandle?: boolean }) => {
         "data-[direction=vertical]:h-px data-[direction=vertical]:after:left-0 data-[direction=vertical]:after:top-[calc(50%-0.5px)] data-[direction=vertical]:after:h-px data-[direction=vertical]:after:w-full data-[direction=vertical]:cursor-row-resize",
         "data-[direction=horizontal]:w-px data-[direction=horizontal]:after:inset-y-0 data-[direction=horizontal]:after:left-[calc(50%-0.5px)] data-[direction=horizontal]:after:w-px data-[direction=horizontal]:cursor-col-resize"
       )}
+      onPreResize={onPreResize}
     >
       {withHandle && (
         <div
diff --git a/apps/docs/src/pages/SandboxPage.tsx b/apps/docs/src/pages/SandboxPage.tsx
index e19cc03..a8d55fb 100644
--- a/apps/docs/src/pages/SandboxPage.tsx
+++ b/apps/docs/src/pages/SandboxPage.tsx
@@ -5,6 +5,12 @@ import { useState } from "react";
 
 export const SandboxPage = () => {
   const [panel2Open, setPanel2Open] = useState(true);
+  const onPreResize = (sizes: {
+    panel1NewSize: number;
+    panel2NewSize: number;
+  }) => {
+    return { abort: sizes.panel1NewSize > 300 };
+  };
   return (
     <div>
       <div className="h-full w-full border">
@@ -16,7 +22,7 @@ export const SandboxPage = () => {
           </FlexyPanel>
           {panel2Open && (
             <>
-              <FlexyHandle />
+              <FlexyHandle onPreResize={onPreResize} />
               <FlexyPanel defaultSize={33}>
                 <div className="flex items-center justify-center h-100">
                   Panel 2
diff --git a/packages/react-flexy-panels/src/types/OnPreResizeFunction.t.ts b/packages/react-flexy-panels/src/types/OnPreResizeFunction.t.ts
index d148c59..e1b70b3 100644
--- a/packages/react-flexy-panels/src/types/OnPreResizeFunction.t.ts
+++ b/packages/react-flexy-panels/src/types/OnPreResizeFunction.t.ts
@@ -1,4 +1,8 @@
+export type OnPreResizeReturnOptions = {
+  abort?: boolean;
+};
+
 export type OnPreResizeFunction = (sizes: {
   panel1NewSize: number;
   panel2NewSize: number;
-}) => void;
+}) => OnPreResizeReturnOptions | undefined | void;
diff --git a/packages/react-flexy-panels/src/utils/updatePanelSizes.ts b/packages/react-flexy-panels/src/utils/updatePanelSizes.ts
index e1c0435..d3a2a7f 100644
--- a/packages/react-flexy-panels/src/utils/updatePanelSizes.ts
+++ b/packages/react-flexy-panels/src/utils/updatePanelSizes.ts
@@ -94,10 +94,13 @@ export function updatePanelSizes(props: {
   }
 
   // Call the onPreResize function to allow any custom logic to be applied before the panel sizes are updated
-  onPreResize?.({
+  const onPreResizeResult = onPreResize?.({
     panel1NewSize,
     panel2NewSize,
   });
+  if (onPreResizeResult?.abort) {
+    return 0;
+  }
 
   // Handle different unit combinations
   if (panel1Unit === "auto" && panel2Unit === "auto") {