@ahoo-wang/fetcher-react 3.1.5 → 3.1.8

package/README.md

@@ -87,17 +87,25 @@ function App() {
 ### useFetcher Hook
 
 The `useFetcher` hook provides complete data fetching capabilities with automatic state management, race condition
-protection, and flexible configuration options.
+protection, and flexible configuration options. It includes built-in AbortController support inherited from `useExecutePromise`.
 
 ```typescript jsx
 import { useFetcher } from '@ahoo-wang/fetcher-react';
 
 const MyComponent = () => {
-  const { loading, error, result, execute } = useFetcher<string>();
+  const { loading, error, result, execute, abort } = useFetcher<string>({
+    onAbort: () => {
+      console.log('Fetch operation was aborted');
+    }
+  });
 
   const handleFetch = () => {
     execute({ url: '/api/users', method: 'GET' });
-};
+  };
+
+  const handleAbort = () => {
+    abort(); // Cancel the current fetch operation
+  };
 ```
 
 #### Auto Execute Example
@@ -261,13 +269,17 @@ const SearchInput = () => {
 ### useExecutePromise Hook
 
 The `useExecutePromise` hook manages asynchronous operations with automatic state handling, built-in race condition
-protection, and support for promise state options.
+protection, and support for promise state options. It includes automatic AbortController support for canceling operations.
 
 ```typescript jsx
 import { useExecutePromise } from '@ahoo-wang/fetcher-react';
 
 const MyComponent = () => {
-  const { loading, result, error, execute, reset } = useExecutePromise<string>();
+  const { loading, result, error, execute, reset, abort } = useExecutePromise<string>({
+    onAbort: () => {
+      console.log('Operation was aborted');
+    }
+  });
 
   const fetchData = async () => {
     const response = await fetch('/api/data');
@@ -283,12 +295,17 @@ const MyComponent = () => {
     execute(promise); // Using a direct promise
   };
 
+  const handleAbort = () => {
+    abort(); // Manually abort the current operation
+  };
+
   if (loading) return <div>Loading...</div>;
   if (error) return <div>Error: {error.message}</div>;
   return (
     <div>
       <button onClick={handleFetch}>Fetch with Supplier</button>
       <button onClick={handleDirectPromise}>Fetch with Promise</button>
+      <button onClick={handleAbort} disabled={!loading}>Abort</button>
       <button onClick={reset}>Reset</button>
       {result && <p>{result}</p>}
     </div>
@@ -296,6 +313,15 @@ const MyComponent = () => {
 };
 ```
 
+#### Abort Controller Support
+
+The hook automatically creates an AbortController for each operation and provides methods to manage cancellation:
+
+- **Automatic Cleanup**: Operations are automatically aborted when the component unmounts
+- **Manual Abort**: Use the `abort()` method to cancel ongoing operations
+- **onAbort Callback**: Configure a callback that fires when an operation is aborted (manually or automatically)
+- **AbortController Access**: The AbortController is passed to promise suppliers for advanced cancellation handling
+
 ### usePromiseState Hook
 
 The `usePromiseState` hook provides state management for promise operations without execution logic. Supports both
@@ -1527,6 +1553,8 @@ An object containing:
 - `error`: The error value
 - `exchange`: The FetchExchange object representing the ongoing fetch operation
 - `execute`: Function to execute a fetch request
+- `abort`: Function to manually abort the current fetch operation
+- `onAbort`: Callback function invoked when fetch operation is aborted (configured via options)
 
 ### useExecutePromise
 
@@ -1561,6 +1589,8 @@ An object containing:
 - `error`: The error value
 - `execute`: Function to execute a promise supplier or promise
 - `reset`: Function to reset the state to initial values
+- `abort`: Function to manually abort the current operation
+- `onAbort`: Callback function invoked when operation is aborted (configured via options)
 
 ### usePromiseState
 

package/dist/core/index.d.ts

@@ -6,4 +6,5 @@ export * from './useMounted';
 export * from './useRefs';
 export * from './useDebouncedCallback';
 export * from './useDebouncedExecutePromise';
+export * from './useForceUpdate';
 //# sourceMappingURL=index.d.ts.map

package/dist/core/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAaA,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAaA,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kBAAkB,CAAC"}

package/dist/core/useDebouncedExecutePromise.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDebouncedExecutePromise.d.ts","sourceRoot":"","sources":["../../src/core/useDebouncedExecutePromise.ts"],"names":[],"mappings":"AAaA,OAAO,EAEL,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAEL,2BAA2B,EAC3B,0BAA0B,EAC3B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGlD;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,QAAQ,EAAE,2BAA2B,CAAC;CACvC;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,iCAAiC,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,CAC/D,SAAQ,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC,EACpC,eAAe;CAAG;AAEtB;;;;;;;GAOG;AACH,MAAM,WAAW,gCAAgC,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,CAC9D,SAAQ,IAAI,CAAC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,EACpD,0BAA0B,CAAC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;CAAG;AAE3E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,wBAAgB,0BAA0B,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,YAAY,EACtE,OAAO,EAAE,iCAAiC,CAAC,CAAC,EAAE,CAAC,CAAC,GAC/C,gCAAgC,CAAC,CAAC,EAAE,CAAC,CAAC,CAqBxC"}
+{"version":3,"file":"useDebouncedExecutePromise.d.ts","sourceRoot":"","sources":["../../src/core/useDebouncedExecutePromise.ts"],"names":[],"mappings":"AAaA,OAAO,EAEL,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAEL,2BAA2B,EAC3B,0BAA0B,EAC3B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGlD;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,QAAQ,EAAE,2BAA2B,CAAC;CACvC;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,iCAAiC,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,CAC/D,SAAQ,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC,EACpC,eAAe;CAClB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,gCAAgC,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,CAC9D,SAAQ,IAAI,CAAC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,EACpD,0BAA0B,CAAC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;CACvE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,wBAAgB,0BAA0B,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,YAAY,EACtE,OAAO,EAAE,iCAAiC,CAAC,CAAC,EAAE,CAAC,CAAC,GAC/C,gCAAgC,CAAC,CAAC,EAAE,CAAC,CAAC,CAsBxC"}

package/dist/core/useExecutePromise.d.ts

@@ -13,13 +13,19 @@ export interface UseExecutePromiseOptions<R, E = unknown> extends UsePromiseStat
      * @default false
      */
     propagateError?: boolean;
+    /**
+     * Callback function called when the current operation is aborted.
+     * This includes both automatic cancellation (when a new operation starts) and manual abortion.
+     */
+    onAbort?: () => void | Promise<void>;
 }
 /**
- * Type definition for a function that returns a Promise.
+ * Type definition for a function that returns a Promise with optional abort controller support.
  * This is used as input to the execute function, allowing lazy evaluation of promises.
+ * The abort controller can be used to cancel the promise if needed.
  * @template R - The type of value the promise will resolve to.
  */
-export type PromiseSupplier<R> = () => Promise<R>;
+export type PromiseSupplier<R> = (abortController: AbortController) => Promise<R>;
 /**
  * Interface defining the return type of the useExecutePromise hook.
  * Provides state management and control functions for asynchronous operations.
@@ -28,24 +34,39 @@ export type PromiseSupplier<R> = () => Promise<R>;
  */
 export interface UseExecutePromiseReturn<R, E = FetcherError> extends PromiseState<R, E> {
     /**
-     * Function to execute a promise supplier or promise.
+     * Function to execute a promise supplier with automatic abort support.
+     * Automatically cancels any previous ongoing request before starting a new one.
      * Manages the loading state, handles errors, and updates the result state.
-     * @param input - A function that returns a Promise or a Promise directly.
-     * @returns A Promise that resolves to the result on success, or the error if propagateError is false.
+     * @param input - A function that returns a Promise, optionally receiving an AbortController.
      * @throws {Error} If the component is unmounted when execute is called.
      * @throws {E} If propagateError is true and the promise rejects.
      */
-    execute: (input: PromiseSupplier<R> | Promise<R>) => Promise<R | E>;
+    execute: (input: PromiseSupplier<R>) => Promise<void>;
     /**
      * Function to reset the state to initial values.
      * Clears loading, result, error, and sets status to idle.
      */
     reset: () => void;
+    /**
+     * Function to manually abort the current ongoing operation.
+     * This will cancel the current promise execution and set the state to idle.
+     * Safe to call even when no operation is currently running.
+     */
+    abort: () => void;
 }
 /**
- * A React hook for managing asynchronous operations with proper state handling.
+ * A React hook for managing asynchronous operations with proper state handling and abort support.
  * Provides a way to execute promises while automatically managing loading states,
- * handling errors, and preventing state updates on unmounted components or stale requests.
+ * handling errors, preventing state updates on unmounted components or stale requests,
+ * and supporting request cancellation through AbortController.
+ *
+ * Key features:
+ * - Automatic request cancellation when new requests are initiated
+ * - Manual abort control with dedicated abort() method
+ * - AbortController integration for promise-level cancellation
+ * - Race condition protection using request IDs
+ * - Comprehensive state management (idle, loading, success, error)
+ * - Memory leak prevention with automatic cleanup on unmount
  *
  * @template R - The type of the result value, defaults to unknown.
  * @template E - The type of the error value, defaults to FetcherError.
@@ -56,20 +77,71 @@ export interface UseExecutePromiseReturn<R, E = FetcherError> extends PromiseSta
  * @throws {E} When propagateError is true and the executed promise rejects.
  *
  * @example
- * Basic usage with state management:
+ * Basic usage with automatic abort support and onAbort callback:
+ * ```typescript
+ * import { useExecutePromise } from '@ahoo-wang/fetcher-react';
+ *
+ * function MyComponent() {
+ *   const { loading, result, error, execute, reset, abort } = useExecutePromise<string>({
+ *     onAbort: () => {
+ *       console.log('Request was cancelled');
+ *       // Handle abort (e.g., update UI, cleanup resources)
+ *     }
+ *   });
+ *
+ *   const fetchData = async (abortController?: AbortController) => {
+ *     const response = await fetch('/api/data', {
+ *       signal: abortController?.signal,
+ *     });
+ *     return response.text();
+ *   };
+ *
+ *   const handleFetch = () => {
+ *     execute(fetchData); // Automatically cancels previous request and calls onAbort
+ *   };
+ *
+ *   const handleCancel = () => {
+ *     abort(); // Manually cancel current request and calls onAbort
+ *   };
+ *
+ *   const handleReset = () => {
+ *     reset();
+ *   };
+ *
+ *   if (loading) return <div>Loading...</div>;
+ *   if (error) return <div>Error: {error.message}</div>;
+ *   return (
+ *     <div>
+ *       <button onClick={handleFetch}>Fetch Data</button>
+ *       <button onClick={handleCancel} disabled={!loading}>Cancel</button>
+ *       <button onClick={handleReset}>Reset</button>
+ *       {result && <p>{result}</p>}
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * Basic usage with automatic abort support:
  * ```typescript
  * import { useExecutePromise } from '@ahoo-wang/fetcher-react';
  *
  * function MyComponent() {
- *   const { loading, result, error, execute, reset } = useExecutePromise<string>();
+ *   const { loading, result, error, execute, reset, abort } = useExecutePromise<string>();
  *
- *   const fetchData = async () => {
- *     const response = await fetch('/api/data');
+ *   const fetchData = async (abortController?: AbortController) => {
+ *     const response = await fetch('/api/data', {
+ *       signal: abortController?.signal, // Optional: use abort signal
+ *     });
  *     return response.text();
  *   };
  *
  *   const handleFetch = () => {
- *     execute(fetchData);
+ *     execute(fetchData); // Automatically cancels previous request
+ *   };
+ *
+ *   const handleCancel = () => {
+ *     abort(); // Manually cancel current request
  *   };
  *
  *   const handleReset = () => {
@@ -81,6 +153,7 @@ export interface UseExecutePromiseReturn<R, E = FetcherError> extends PromiseSta
  *   return (
  *     <div>
  *       <button onClick={handleFetch}>Fetch Data</button>
+ *       <button onClick={handleCancel} disabled={!loading}>Cancel</button>
  *       <button onClick={handleReset}>Reset</button>
  *       {result && <p>{result}</p>}
  *     </div>
@@ -103,13 +176,6 @@ export interface UseExecutePromiseReturn<R, E = FetcherError> extends PromiseSta
  * };
  * ```
  *
- * @example
- * Executing a promise directly instead of a supplier function:
- * ```typescript
- * const { execute } = useExecutePromise<number>();
- * const promise = fetch('/api/count').then(r => r.json());
- * const result = await execute(promise);
- * ```
  */
 export declare function useExecutePromise<R = unknown, E = FetcherError>(options?: UseExecutePromiseOptions<R, E>): UseExecutePromiseReturn<R, E>;
 //# sourceMappingURL=useExecutePromise.d.ts.map

package/dist/core/useExecutePromise.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useExecutePromise.d.ts","sourceRoot":"","sources":["../../src/core/useExecutePromise.ts"],"names":[],"mappings":"AAeA,OAAO,EAEL,YAAY,EACZ,sBAAsB,EACvB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD;;;;GAIG;AACH,MAAM,WAAW,wBAAwB,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,CACtD,SAAQ,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC;IACpC;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;;;GAIG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI,MAAM,OAAO,CAAC,CAAC,CAAC,CAAC;AAElD;;;;;GAKG;AACH,MAAM,WAAW,uBAAuB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAC1D,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAC1B;;;;;;;OAOG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IACpE;;;OAGG;IACH,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoEG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,YAAY,EAC7D,OAAO,CAAC,EAAE,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC,GACvC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,CAwE/B"}
+{"version":3,"file":"useExecutePromise.d.ts","sourceRoot":"","sources":["../../src/core/useExecutePromise.ts"],"names":[],"mappings":"AAeA,OAAO,EAEL,YAAY,EACZ,sBAAsB,EACvB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD;;;;GAIG;AACH,MAAM,WAAW,wBAAwB,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,CACtD,SAAQ,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC;IACpC;;;;;OAKG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACtC;AAED;;;;;GAKG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI,CAC/B,eAAe,EAAE,eAAe,KAC7B,OAAO,CAAC,CAAC,CAAC,CAAC;AAEhB;;;;;GAKG;AACH,MAAM,WAAW,uBAAuB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAC1D,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAC1B;;;;;;;OAOG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACtD;;;OAGG;IACH,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB;;;;OAIG;IACH,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0HG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,YAAY,EAC7D,OAAO,CAAC,EAAE,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC,GACvC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,CA0H/B"}

package/dist/core/useForceUpdate.d.ts

@@ -0,0 +1,31 @@
+/**
+ * A React hook that returns a function to force a component to re-render.
+ * This is useful when you need to trigger a re-render imperatively, such as
+ * when dealing with external state changes or imperative updates.
+ *
+ * @returns A function that when called, forces the component to re-render
+ *
+ * @example
+ * ```typescript
+ * import { useForceUpdate } from '@ahoo-wang/fetcher-react';
+ *
+ * const MyComponent = () => {
+ *   const forceUpdate = useForceUpdate();
+ *
+ *   const handleExternalChange = () => {
+ *     // Some external state change that doesn't trigger React re-render
+ *     externalLibrary.updateSomething();
+ *     forceUpdate(); // Force re-render to reflect changes
+ *   };
+ *
+ *   return (
+ *     <div>
+ *       <p>Component state: {someValue}</p>
+ *       <button onClick={handleExternalChange}>Update External State</button>
+ *     </div>
+ *   );
+ * };
+ * ```
+ */
+export declare function useForceUpdate(): () => void;
+//# sourceMappingURL=useForceUpdate.d.ts.map

package/dist/core/useForceUpdate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForceUpdate.d.ts","sourceRoot":"","sources":["../../src/core/useForceUpdate.ts"],"names":[],"mappings":"AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,cAAc,IAAI,MAAM,IAAI,CAG3C"}

package/dist/fetcher/useDebouncedFetcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDebouncedFetcher.d.ts","sourceRoot":"","sources":["../../src/fetcher/useDebouncedFetcher.ts"],"names":[],"mappings":"AAaA,OAAO,EAAc,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAC/E,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EACL,eAAe,EAEf,0BAA0B,EAC3B,MAAM,SAAS,CAAC;AAGjB;;;;;;;GAOG;AACH,MAAM,WAAW,0BAA0B,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAC7D,SAAQ,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,EAC7B,eAAe;CAAG;AAEtB;;;;;;;GAOG;AACH,MAAM,WAAW,yBAAyB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAC5D,SAAQ,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,EAC7C,0BAA0B,CAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;CAAG;AAEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkEG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,EACrD,OAAO,EAAE,0BAA0B,CAAC,CAAC,EAAE,CAAC,CAAC,GACxC,yBAAyB,CAAC,CAAC,EAAE,CAAC,CAAC,CAsBjC"}
+{"version":3,"file":"useDebouncedFetcher.d.ts","sourceRoot":"","sources":["../../src/fetcher/useDebouncedFetcher.ts"],"names":[],"mappings":"AAaA,OAAO,EAAc,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAC/E,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EACL,eAAe,EAEf,0BAA0B,EAC3B,MAAM,SAAS,CAAC;AAGjB;;;;;;;GAOG;AACH,MAAM,WAAW,0BAA0B,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAC7D,SAAQ,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,EAC7B,eAAe;CAClB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,yBAAyB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CAC5D,SAAQ,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC,EAC7C,0BAA0B,CAAC,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;CAChE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkEG;AACH,wBAAgB,mBAAmB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,EACrD,OAAO,EAAE,0BAA0B,CAAC,CAAC,EAAE,CAAC,CAAC,GACxC,yBAAyB,CAAC,CAAC,EAAE,CAAC,CAAC,CAwBjC"}

package/dist/fetcher/useFetcher.d.ts

@@ -1,5 +1,5 @@
 import { FetcherCapable, FetchExchange, FetchRequest, RequestOptions, FetcherError } from '@ahoo-wang/fetcher';
-import { PromiseState, UsePromiseStateOptions } from '../core';
+import { UseExecutePromiseOptions, UseExecutePromiseReturn } from '../core';
 /**
  * Configuration options for the useFetcher hook.
  * Combines request configuration, fetcher selection, and promise state management options.
@@ -7,7 +7,7 @@ import { PromiseState, UsePromiseStateOptions } from '../core';
  * @template R - The type of the expected result from the fetch operation
  * @template E - The type of error that may be thrown (defaults to FetcherError)
  */
-export interface UseFetcherOptions<R, E = FetcherError> extends RequestOptions, FetcherCapable, UsePromiseStateOptions<R, E> {
+export interface UseFetcherOptions<R, E = FetcherError> extends RequestOptions, FetcherCapable, UseExecutePromiseOptions<R, E> {
 }
 /**
  * Return type of the useFetcher hook.
@@ -16,7 +16,7 @@ export interface UseFetcherOptions<R, E = FetcherError> extends RequestOptions,
  * @template R - The type of the expected result from the fetch operation
  * @template E - The type of error that may be thrown (defaults to FetcherError)
  */
-export interface UseFetcherReturn<R, E = FetcherError> extends PromiseState<R, E> {
+export interface UseFetcherReturn<R, E = FetcherError> extends Omit<UseExecutePromiseReturn<R, E>, 'execute'> {
     /**
      * The FetchExchange object representing the current or most recent fetch operation.
      * Contains request/response details, timing information, and extracted data.
@@ -24,8 +24,9 @@ export interface UseFetcherReturn<R, E = FetcherError> extends PromiseState<R, E
      */
     exchange?: FetchExchange;
     /**
-     * Function to execute a fetch request.
-     * Automatically cancels any ongoing request before starting a new one.
+     * Function to execute a fetch request with automatic abort support.
+     * Automatically cancels any ongoing request before starting a new one using AbortController.
+     * The abort controller is automatically passed to the underlying fetch operation.
      *
      * @param request - The fetch request configuration including URL, method, headers, etc.
      * @returns Promise that resolves when the fetch operation completes (success or failure)
@@ -34,15 +35,16 @@ export interface UseFetcherReturn<R, E = FetcherError> extends PromiseState<R, E
 }
 /**
  * A React hook for managing asynchronous HTTP fetch operations with comprehensive state handling,
- * race condition protection, and automatic cleanup. Provides a clean interface for making API calls
- * with loading states, error handling, and request cancellation.
+ * race condition protection, automatic cleanup, and built-in abort support. Provides a clean interface
+ * for making API calls with loading states, error handling, and request cancellation.
  *
  * Key features:
- * - Automatic request cancellation on component unmount or new requests
+ * - Automatic request cancellation on component unmount or new requests via AbortController
  * - Race condition protection using request IDs
  * - Comprehensive state management (idle, loading, success, error)
  * - Type-safe result and error handling
  * - Integration with fetcher ecosystem for advanced features
+ * - Memory leak prevention with automatic abort controller cleanup
  *
  * @template R - The type of the expected result from the fetch operation
  * @template E - The type of error that may be thrown (defaults to FetcherError)
@@ -55,7 +57,7 @@ export interface UseFetcherReturn<R, E = FetcherError> extends PromiseState<R, E
  *                        HTTP errors, or result extraction problems
  * @throws {Error} When invalid options are provided or fetcher configuration is incorrect
  *
- * @example Basic GET request
+ * @example Basic GET request with automatic abort
  * ```typescript
  * import { useFetcher } from '@ahoo-wang/fetcher-react';
  * import { ResultExtractors } from '@ahoo-wang/fetcher';
@@ -72,6 +74,7 @@ export interface UseFetcherReturn<R, E = FetcherError> extends PromiseState<R, E
  *     });
  *   };
  *
+ *   // Multiple calls to fetchUser() will automatically cancel previous requests
  *   // Handle loading, error, and success states in your component
  * }
  * ```

package/dist/fetcher/useFetcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useFetcher.d.ts","sourceRoot":"","sources":["../../src/fetcher/useFetcher.ts"],"names":[],"mappings":"AAaA,OAAO,EAEL,cAAc,EACd,aAAa,EACb,YAAY,EAEZ,cAAc,EACd,YAAY,EACb,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,YAAY,EAGZ,sBAAsB,EAEvB,MAAM,SAAS,CAAC;AAEjB;;;;;;GAMG;AACH,MAAM,WAAW,iBAAiB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CACpD,SAAQ,cAAc,EACpB,cAAc,EACd,sBAAsB,CAAC,CAAC,EAAE,CAAC,CAAC;CAE/B;AAED;;;;;;GAMG;AACH,MAAM,WAAW,gBAAgB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CACnD,SAAQ,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC;IAC1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB;;;;;;OAMG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACnD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0FG;AACH,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,EAC5C,OAAO,CAAC,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAChC,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,CA2FxB"}
+{"version":3,"file":"useFetcher.d.ts","sourceRoot":"","sources":["../../src/fetcher/useFetcher.ts"],"names":[],"mappings":"AAaA,OAAO,EAEL,cAAc,EACd,aAAa,EACb,YAAY,EAEZ,cAAc,EACd,YAAY,EACb,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAEL,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,SAAS,CAAC;AAIjB;;;;;;GAMG;AACH,MAAM,WAAW,iBAAiB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CACpD,SAAQ,cAAc,EACpB,cAAc,EACd,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC;CACjC;AAED;;;;;;GAMG;AACH,MAAM,WAAW,gBAAgB,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,CACnD,SAAQ,IAAI,CAAC,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,CAAC;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB;;;;;;;OAOG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACnD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4FG;AACH,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,YAAY,EAC5C,OAAO,CAAC,EAAE,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAChC,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,CA8DxB"}