create-request 0.0.1-beta.22 → 0.0.1-beta.24

package/README.md

@@ -14,6 +14,8 @@
 - [Installation](#installation)
 - [Basic Usage](#basic-usage)
 - [Advanced Usage](#advanced-usage)
+- [GraphQL Support](#graphql-support)
+- [Interceptors](#interceptors)
 - [TypeScript Support](#typescript-support)
 - [CSRF Protection](#csrf-protection)
 - [Performance Considerations](#performance-considerations)
@@ -33,8 +35,9 @@
 - 🔁 **Automatic Retries** - Retry failed requests with customizable settings
 - 📉 **Reduced Boilerplate** - Write 60% less code for common API operations
 - 🔒 **CSRF Protection** - Built-in safeguards against cross-site request forgery
-- 📝 **Response Caching** - Flexible caching system with multiple storage options
 - 🛑 **Request Cancellation** - Abort requests on demand with AbortController integration
+- 🔌 **Interceptors** - Global and per-request interceptors for requests, responses, and errors
+- 🔷 **GraphQL Support** - Built-in GraphQL query and mutation helpers
 
 ## Why create-request?
 
@@ -73,10 +76,9 @@ import create from "create-request";
 
 function createUser(userData) {
   return create
-    .post()
+    .post("https://api.example.com/users")
     .withBasicAuth("username", "password")
     .withBody(userData) // Content-Type automatically set to application/json
-    .sendTo("https://api.example.com/users")
     .getData<User>() // Type-safe response handling
     .catch(error => {
       console.error("Fetch error:", error);
@@ -105,14 +107,14 @@ pnpm add create-request
 ```typescript
 import create from "create-request";
 
-// Create different request types
-const getRequest = create.get(); // GET
-const putRequest = create.put(); // PUT
-const postRequest = create.post(); // POST
-const headRequest = create.head(); // HEAD
-const patchRequest = create.patch(); // PATCH
-const deleteRequest = create.del(); // DELETE
-const optionsRequest = create.options(); // OPTIONS
+// Create different request types with URL
+const getRequest = create.get("https://api.example.com/users"); // GET
+const putRequest = create.put("https://api.example.com/users/1"); // PUT
+const postRequest = create.post("https://api.example.com/users"); // POST
+const headRequest = create.head("https://api.example.com/users/1"); // HEAD
+const patchRequest = create.patch("https://api.example.com/users/1"); // PATCH
+const deleteRequest = create.del("https://api.example.com/users/1"); // DELETE
+const optionsRequest = create.options("https://api.example.com/users"); // OPTIONS
 ```
 
 ### Request Configuration
@@ -123,14 +125,14 @@ The library provides a comprehensive set of configuration methods that can be ch
 import create, {
   RequestPriority,
   CredentialsPolicy,
-  RequestMode,
   RedirectMode,
   ReferrerPolicy,
+  SameSitePolicy,
 } from "create-request";
 
 // Configure request options
 const request = create
-  .get()
+  .get("https://api.example.com/users")
   // Basic headers
   .withHeaders({ "X-API-Key": "abc123", "Accept-Language": "en-US" })
   .withHeader("Custom-Header", "value") // Add a single header
@@ -159,20 +161,22 @@ const request = create
     tracking: { value: "enabled", sameSite: SameSitePolicy.STRICT },
   })
 
-  // URL parameters
-  .withQueryParams({ search: "term", page: 1, limit: 20 })
+  // URL parameters (supports arrays, null/undefined filtering, and all types)
+  .withQueryParams({ search: "term", page: 1, limit: 20, tags: ["js", "ts"] })
   .withQueryParam("filter", "active") // Add a single query parameter
+  .withQueryParam("ids", [1, 2, 3]) // Array values create multiple query params
 
   // Request body configuration (for POST/PUT/PATCH)
   .withContentType("application/json") // Set specific content type
 
   // Fetch API options
-  .withCredentials(CredentialsPolicy.INCLUDE) // Includes cookies with cross-origin requests
-  .withMode(RequestMode.CORS) // Controls CORS behavior
-  .withRedirect(RedirectMode.FOLLOW) // Controls redirect behavior (follow, error, manual)
+  // Note: These methods support three styles - Fluent API (shown below), Enum-based (e.g., .withMode(RequestMode.CORS)), or String-based (e.g., .withMode("cors"))
+  .withCredentials.INCLUDE() // Includes cookies with cross-origin requests
+  .withMode.CORS() // Controls CORS behavior
+  .withRedirect.FOLLOW() // Controls redirect behavior (follow, error, manual)
   .withReferrer("https://example.com") // Sets request referrer
-  .withReferrerPolicy(ReferrerPolicy.NO_REFERRER_WHEN_DOWNGRADE) // Controls referrer policy
-  .withPriority(RequestPriority.HIGH) // Sets request priority
+  .withReferrerPolicy.NO_REFERRER_WHEN_DOWNGRADE() // Controls referrer policy
+  .withPriority.HIGH() // Sets request priority
   .withKeepAlive(true); // Keeps connection alive after the page is unloaded
 ```
 
@@ -180,79 +184,152 @@ Each configuration method returns the request object, allowing for a fluent inte
 
 ```typescript
 // Simple example with just what's needed
-const searchUsers = create
-  .get()
+const users = await create
+  .get("https://api.example.com/users")
   .withBearerToken(userToken)
   .withQueryParams({ q: searchTerm, limit: 20 })
-  .withTimeout(3000);
-
-// Now execute the request
-const users = await searchUsers.sendTo("https://api.example.com/users").getData();
-```
-
-You can also create reusable base requests with common settings:
-
-```typescript
-// Create base authenticated request
-const apiBase = create
-  .get()
-  .withHeaders({
-    "X-API-Version": "1.2",
-    "Accept-Language": "en-US",
-  })
-  .withBearerToken(authToken)
-  .withTimeout(5000)
-  .withRetries(2);
-
-// Use the base request for different endpoints
-const users = await apiBase.sendTo("https://api.example.com/users").getData();
-const products = await apiBase.sendTo("https://api.example.com/products").getData();
+  .withTimeout(3000)
+  .getData();
 ```
 
 ### Request Bodies (POST/PUT/PATCH)
 
 ```typescript
 // JSON body (Content-Type automatically set to application/json)
-const jsonRequest = create.post().withBody({ name: "John", age: 30 });
+const jsonRequest = create
+  .post("https://api.example.com/users")
+  .withBody({ name: "John", age: 30 });
 
 // String body (Content-Type automatically set to text/plain)
-const textRequest = create.post().withBody("Plain text content");
+const textRequest = create
+  .post("https://api.example.com/users")
+  .withBody("Plain text content");
 
 // Form data
 const formData = new FormData();
 formData.append("name", "John");
 formData.append("file", fileBlob);
 
-const formRequest = create.post().withBody(formData);
+const formRequest = create.post("https://api.example.com/users").withBody(formData);
 
 // URLSearchParams (typically used for application/x-www-form-urlencoded)
 const params = new URLSearchParams();
 params.append("username", "john");
 params.append("password", "secret");
 
-const formUrlEncodedRequest = create.post().withBody(params);
+const formUrlEncodedRequest = create.post("https://api.example.com/login").withBody(params);
+```
+
+### GraphQL Requests
+
+The library provides built-in support for GraphQL queries and mutations:
+
+```typescript
+// GraphQL query without variables
+const users = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL("query { users { id name email } }")
+  .getJson();
+
+// GraphQL query with variables
+const user = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL("query GetUser($id: ID!) { user(id: $id) { name email } }", { id: "123" })
+  .getJson();
+
+// GraphQL mutation
+const result = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL(
+    "mutation CreateUser($name: String!) { createUser(name: $name) { id name } }",
+    { name: "John Doe" }
+  )
+  .getJson();
+```
+
+The `withGraphQL` method automatically:
+
+- Formats the body as JSON with `query` and optional `variables` properties
+- Sets `Content-Type` to `application/json`
+- Trims whitespace from the query string
+- Validates the query is non-empty
+- Validates variables are a plain object (not arrays or null)
+
+### Query Parameters Advanced Features
+
+The library supports advanced query parameter handling:
+
+```typescript
+// Array values create multiple query params with the same key
+const request = create.get("https://api.example.com/search").withQueryParams({
+  tags: ["javascript", "typescript", "node"], // ?tags=javascript&tags=typescript&tags=node
+  page: 1,
+  active: true,
+});
+
+// Null and undefined values are automatically filtered out
+const filtered = create.get("https://api.example.com/users").withQueryParams({
+  name: "John",
+  age: null, // Ignored
+  email: undefined, // Ignored
+});
+
+// Supports all JavaScript types (strings, numbers, booleans, arrays)
+const typed = create.get("https://api.example.com/data").withQueryParams({
+  page: 1, // Number
+  active: true, // Boolean
+  tags: ["js", "ts"], // Array
+  name: "John", // String
+});
+
+// Merge with existing query params in URL
+const merged = create
+  .get("https://api.example.com/users?existing=value")
+  .withQueryParams({ new: "param" }); // Both existing and new params included
 ```
 
 ### Executing Requests
 
 ```typescript
-// Simple execution
-const response = await request.sendTo("https://api.example.com/endpoint");
+// Get the full response
+const response = await create.get("https://api.example.com/endpoint").getResponse();
 
 // With direct data extraction
-const jsonData = await request.sendTo("https://api.example.com/endpoint").getJson();
-const textData = await request.sendTo("https://api.example.com/endpoint").getText();
-const blobData = await request.sendTo("https://api.example.com/endpoint").getBlob();
-const bodyStream = await request.sendTo("https://api.example.com/endpoint").getBody();
-const arrayBuffer = await request.sendTo("https://api.example.com/endpoint").getArrayBuffer();
+const jsonData = await create.get("https://api.example.com/endpoint").getJson();
+const textData = await create.get("https://api.example.com/endpoint").getText();
+const blobData = await create.get("https://api.example.com/endpoint").getBlob();
+const bodyStream = await create.get("https://api.example.com/endpoint").getBody();
 
 // Using the data selector API to extract specific data
-const userData = await request
-  .sendTo("https://api.example.com/users")
+const userData = await create
+  .get("https://api.example.com/users")
   .getData(data => data.results.users);
 
 // Using the data selector without a selector function just returns the full JSON response
-const fullData = await request.sendTo("https://api.example.com/data").getData();
+const fullData = await create.get("https://api.example.com/data").getData();
+```
+
+### ResponseWrapper Properties
+
+When you use `getResponse()`, you get a `ResponseWrapper` object that provides convenient access to response properties and methods:
+
+```typescript
+const response = await create.get("https://api.example.com/users").getResponse();
+
+// Access response properties directly
+console.log(response.status); // HTTP status code (e.g., 200)
+console.log(response.statusText); // Status text (e.g., "OK")
+console.log(response.ok); // Boolean: true if status is 200-299
+console.log(response.headers); // Headers object
+console.log(response.url); // Request URL
+console.log(response.method); // HTTP method
+console.log(response.raw); // Raw Response object from fetch
+
+// Use wrapper methods for body parsing
+const json = await response.getJson();
+const text = await response.getText();
+const blob = await response.getBlob();
+const stream = response.getBody(); // ReadableStream or null
 ```
 
 ### Error Handling
@@ -261,14 +338,15 @@ All errors from requests are instances of `RequestError` with detailed informati
 
 ```typescript
 try {
-  const data = await request.sendTo("https://api.example.com/data").getJson();
+  const data = await create.get("https://api.example.com/data").getJson();
 } catch (error) {
   // error will always be a RequestError
   console.log(error.message); // Error message
   console.log(error.status); // HTTP status code (if available)
   console.log(error.url); // Request URL
   console.log(error.method); // HTTP method
-  console.log(error.timeoutError); // Whether it was a timeout
+  console.log(error.isTimeout); // Whether it was a timeout
+  console.log(error.isAborted); // Whether it was aborted/cancelled
 
   // Access the original response if available
   if (error.response) {
@@ -278,77 +356,186 @@ try {
 }
 ```
 
-### Caching Requests
+## Advanced Usage
 
-```typescript
-import create, {
-  createMemoryStorage,
-  createLocalStorageStorage,
-  createSessionStorageStorage,
-} from "create-request";
+### GraphQL Support
 
-// Simple in-memory caching
-const request = create
-  .get()
-  .withCache({
-    storage: createMemoryStorage(),
-    ttl: 60000, // 1 minute in milliseconds
+`create-request` provides first-class support for GraphQL with the `withGraphQL` method:
+
+```typescript
+// Simple query
+const query = "query { user { name email } }";
+const data = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL(query)
+  .getJson();
+
+// Query with variables
+const queryWithVars = "query GetUser($id: ID!) { user(id: $id) { name email } }";
+const user = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL(queryWithVars, { id: "123" })
+  .getJson();
+
+// Mutation
+const mutation =
+  "mutation CreateUser($name: String!) { createUser(name: $name) { id name } }";
+const result = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL(mutation, { name: "John Doe" })
+  .getJson();
+
+// Complex variables with nested objects
+const complexQuery =
+  "query SearchUsers($filters: UserFilters!) { users(filters: $filters) { id name } }";
+const results = await create
+  .post("https://api.example.com/graphql")
+  .withGraphQL(complexQuery, {
+    filters: {
+      name: "John",
+      age: 30,
+      tags: ["active", "verified"],
+      metadata: {
+        source: "web",
+        verified: true,
+      },
+    },
   })
-  .sendTo("https://api.example.com/data");
+  .getJson();
+```
 
-// Using localStorage storage
-const request = create
-  .get()
-  .withCache({
-    storage: createLocalStorageStorage(),
-    ttl: 5 * 60 * 1000, // 5 minutes
-    maxSize: "1MB",
-    keyPrefix: "user-data",
+### Interceptors
+
+Interceptors allow you to modify requests, transform responses, or handle errors globally or per-request. This is perfect for adding authentication tokens, logging, error recovery, and more.
+
+#### Global Interceptors
+
+Global interceptors apply to all requests:
+
+```typescript
+// Add a global request interceptor (modify all requests)
+const requestInterceptorId = create.config.addRequestInterceptor(config => {
+  // Add auth token to all requests
+  config.headers["Authorization"] = `Bearer ${getToken()}`;
+  // Modify URL, headers, body, etc.
+  return config;
+});
+
+// Add a global response interceptor (transform all responses)
+const responseInterceptorId = create.config.addResponseInterceptor(response => {
+  console.log(`Response received: ${response.status}`);
+  // Transform or modify the response
+  return response;
+});
+
+// Add a global error interceptor (handle all errors)
+const errorInterceptorId = create.config.addErrorInterceptor(error => {
+  console.error("Request failed:", error.message);
+  // Can throw to propagate error, or return ResponseWrapper to recover
+  throw error;
+});
+
+// Remove interceptors when no longer needed
+create.config.removeRequestInterceptor(requestInterceptorId);
+create.config.removeResponseInterceptor(responseInterceptorId);
+create.config.removeErrorInterceptor(errorInterceptorId);
+
+// Clear all interceptors at once
+create.config.clearInterceptors();
+```
+
+#### Per-Request Interceptors
+
+Per-request interceptors apply only to a specific request:
+
+```typescript
+// Request interceptor - modify request configuration
+const data = await create
+  .get("https://api.example.com/users")
+  .withRequestInterceptor(config => {
+    config.headers["X-Custom-Header"] = "value";
+    config.url = "https://api.example.com/modified-url"; // Can modify URL
+    return config;
   })
-  .sendTo("https://api.example.com/users");
+  .getJson();
+
+// Response interceptor - transform response
+const transformed = await create
+  .get("https://api.example.com/users")
+  .withResponseInterceptor(response => {
+    console.log(`Got response with status ${response.status}`);
+    return response;
+  })
+  .getJson();
 
-// Using sessionStorage for per-session caching
-const request = create
-  .get()
-  .withCache({
-    storage: createSessionStorageStorage(),
-    maxEntries: 50,
-    varyByHeaders: ["x-api-version"],
+// Error interceptor - handle or recover from errors
+const recovered = await create
+  .get("https://api.example.com/users")
+  .withErrorInterceptor(error => {
+    // Option 1: Throw to propagate error
+    throw error;
+
+    // Option 2: Return a ResponseWrapper to recover from error
+    // return new ResponseWrapper(fallbackResponse, error.url, error.method);
   })
-  .sendTo("https://api.example.com/data");
+  .getJson();
 ```
 
-## Advanced Usage
+#### Interceptor Execution Order
+
+Interceptors execute in a specific order:
 
-### Request Reuse
+1. **Request interceptors**: Global interceptors run first (in registration order), then per-request interceptors (in registration order)
+2. **Response interceptors**: Per-request interceptors run first (in registration order), then global interceptors (in reverse registration order)
+3. **Error interceptors**: Per-request interceptors run first (in registration order), then global interceptors (in reverse registration order)
 
 ```typescript
-// Create a base authenticated request
-const authRequest = create.get().withBearerToken("token123").withTimeout(5000).withRetries(2);
-
-// Reuse for different endpoints
-const users = await authRequest.sendTo("https://api.example.com/users").getJson();
-const products = await authRequest.sendTo("https://api.example.com/products").getJson();
-
-// You can also create application-wide base requests
-const apiBase = () =>
-  create
-    .get()
-    .withHeaders({
-      "X-API-Version": "1.2",
-      "Accept-Language": "en-US",
-    })
-    .withBearerToken(getAuthToken()) // Get fresh token each time
-    .withTimeout(5000);
-
-// Use throughout your application
-function getUsers() {
-  return apiBase().sendTo("https://api.example.com/users").getData();
-}
+// Request: Global 1 → Global 2 → Per-request 1 → Per-request 2
+// Response: Per-request 1 → Per-request 2 → Global 2 → Global 1
+const data = await create
+  .get("https://api.example.com/users")
+  .withRequestInterceptor(() => console.log("Per-request 1"))
+  .withRequestInterceptor(() => console.log("Per-request 2"))
+  .getJson();
+```
 
-function getProducts() {
-  return apiBase().sendTo("https://api.example.com/products").getData();
-}
+#### Advanced Interceptor Patterns
+
+```typescript
+// Short-circuit request with early response
+const cached = await create
+  .get("https://api.example.com/users")
+  .withRequestInterceptor(() => {
+    // Return early response from cache
+    return new Response(JSON.stringify(cachedData), {
+      status: 200,
+      headers: { "Content-Type": "application/json" },
+    });
+  })
+  .getJson();
+
+// Recover from error with fallback
+const fallback = await create
+  .get("https://api.example.com/users")
+  .withErrorInterceptor(error => {
+    // Return fallback response instead of throwing
+    const fallbackResponse = new Response(JSON.stringify({ users: [] }), {
+      status: 200,
+      headers: { "Content-Type": "application/json" },
+    });
+    return new ResponseWrapper(fallbackResponse, error.url, error.method);
+  })
+  .getJson();
+
+// Async interceptors
+const asyncData = await create
+  .get("https://api.example.com/users")
+  .withRequestInterceptor(async config => {
+    const token = await getTokenAsync();
+    config.headers["Authorization"] = `Bearer ${token}`;
+    return config;
+  })
+  .getJson();
 ```
 
 ### Request Cancellation
@@ -356,17 +543,20 @@ function getProducts() {
 ```typescript
 const controller = new AbortController();
 
-const request = create.get().withTimeout(10000).withAbortController(controller);
+const request = create
+  .get("https://api.example.com/slow-endpoint")
+  .withTimeout(10000)
+  .withAbortController(controller);
 
 // Later, cancel the request if needed
 setTimeout(() => controller.abort(), 2000);
 
 try {
-  const data = await request.sendTo("https://api.example.com/slow-endpoint").getJson();
+  const data = await request.getJson();
 } catch (error) {
   if (error.name === "AbortError") {
     console.log("Request was cancelled by user");
-  } else if (error.timeoutError) {
+  } else if (error.isTimeout) {
     console.log("Request timed out");
   } else {
     console.log("Other error:", error.message);
@@ -374,104 +564,71 @@ try {
 }
 ```
 
+### URL Handling
+
+The library handles both absolute and relative URLs, and automatically merges query parameters:
+
+```typescript
+// Relative URLs (preserved as-is)
+const relative = await create.get("/api/users").getJson();
+
+// Absolute URLs
+const absolute = await create.get("https://api.example.com/users").getJson();
+
+// Merging query params with existing URL params
+const merged = await create
+  .get("https://api.example.com/users?page=1")
+  .withQueryParams({ limit: 20, sort: "name" })
+  .getJson();
+// Result: https://api.example.com/users?page=1&limit=20&sort=name
+
+// Special characters and unicode are properly encoded
+const encoded = await create
+  .get("https://api.example.com/search")
+  .withQueryParams({ name: "用户名", filter: "status:active" })
+  .getJson();
+```
+
 ### Data Selection
 
 The `getData` method provides a powerful way to extract and transform specific data from API responses:
 
 ```typescript
 // Extract specific properties from nested structures
-const posts = await request
-  .sendTo("https://api.example.com/feed")
+const posts = await create
+  .get("https://api.example.com/feed")
   .getData(data => data.feed.posts);
 
 // Transform data in the selector function
-const usernames = await request
-  .sendTo("https://api.example.com/users")
+const usernames = await create
+  .get("https://api.example.com/users")
   .getData(data => data.users.map(user => user.username));
 
 // Apply filtering in the selector
-const activeUsers = await request
-  .sendTo("https://api.example.com/users")
+const activeUsers = await create
+  .get("https://api.example.com/users")
   .getData(data => data.users.filter(user => user.isActive));
 
 // Combine data from complex nested structures
-const combinedData = await request
-  .sendTo("https://api.example.com/dashboard")
-  .getData(data => ({
-    userCount: data.stats.users.total,
-    recentPosts: data.content.recent.slice(0, 5),
-    notifications: data.user.notifications.unread,
-  }));
+const combinedData = await create.get("https://api.example.com/dashboard").getData(data => ({
+  userCount: data.stats.users.total,
+  recentPosts: data.content.recent.slice(0, 5),
+  notifications: data.user.notifications.unread,
+}));
 ```
 
-When a selector fails, the error message will contain the original response data to help diagnose the issue:
+When a selector fails, the error message will contain helpful context to diagnose the issue:
 
 ```typescript
 try {
   // This will fail if the response structure doesn't match expectations
-  const result = await request
-    .sendTo("https://api.example.com/data")
+  const result = await create
+    .get("https://api.example.com/data")
     .getData(data => data.results.items);
 } catch (error) {
   console.error(error);
-  // Error message includes the original response data for debugging
-}
-```
-
-### Implementing Custom Storage Providers
-
-You can create your own storage provider by implementing the `StorageProvider` interface:
-
-```typescript
-import { StorageProvider } from "create-request";
-
-// Create a namespaced storage provider
-export function createNamespacedStorage(namespace: string): StorageProvider {
-  return {
-    get(key: string): string | null {
-      return localStorage.getItem(`${namespace}:${key}`);
-    },
-
-    set(key: string, value: string): void {
-      try {
-        localStorage.setItem(`${namespace}:${key}`, value);
-      } catch (e) {
-        // Handle quota exceeded errors
-        console.warn("Storage quota exceeded, clearing cache");
-        this.clear();
-        try {
-          localStorage.setItem(`${namespace}:${key}`, value);
-        } catch (e) {
-          console.error("Failed to set cache item even after clearing cache");
-        }
-      }
-    },
-
-    has(key: string): boolean {
-      return localStorage.getItem(`${namespace}:${key}`) !== null;
-    },
-
-    delete(key: string): void {
-      localStorage.removeItem(`${namespace}:${key}`);
-    },
-
-    clear(): void {
-      // Only clear items in our namespace
-      Object.keys(localStorage)
-        .filter(key => key.startsWith(`${namespace}:`))
-        .forEach(key => localStorage.removeItem(key));
-    },
-  };
+  // Error message includes context for debugging
 }
-
-// Usage:
-const request = create
-  .get()
-  .withCache({
-    storage: createNamespacedStorage("api-cache"),
-    ttl: 24 * 60 * 60 * 1000, // 24 hours
-  })
-  .sendTo("https://api.example.com/data");
 ```
 
 ## TypeScript Support
@@ -494,14 +651,12 @@ interface ApiResponse<T> {
 
 // Type the full response
 const response = await create
-  .get()
-  .sendTo("https://api.example.com/users")
+  .get("https://api.example.com/users")
   .getJson<ApiResponse<User[]>>();
 
 // Or use getData with type parameters
 const users = await create
-  .get()
-  .sendTo("https://api.example.com/users")
+  .get("https://api.example.com/users")
   .getData<ApiResponse<User[]>, User[]>(data => data.data);
 
 // TypeScript knows the types
@@ -512,9 +667,8 @@ users.forEach(user => {
 // Function with proper types
 async function getUserById(id: number): Promise<User> {
   return create
-    .get()
+    .get("https://api.example.com/users")
     .withQueryParam("id", id)
-    .sendTo("https://api.example.com/users")
     .getData<ApiResponse<User[]>, User>(data => {
       const user = data.data[0];
       if (!user) throw new Error(`User with ID ${id} not found`);
@@ -544,10 +698,14 @@ You can configure CSRF settings globally for all requests:
 ```typescript
 // Configure CSRF settings for all requests
 create.config.setCsrfToken("your-csrf-token");
-create.config.setCsrfHeaderName("X-CSRF-Token"); // Default header name
-create.config.setXsrfCookieName("XSRF-TOKEN"); // Default cookie name
+create.config.setCsrfHeaderName("X-CSRF-Token"); // Default header name for CSRF token
+create.config.setXsrfCookieName("XSRF-TOKEN"); // Default cookie name to read from
+create.config.setXsrfHeaderName("X-XSRF-TOKEN"); // Default header name for XSRF token from cookie
 create.config.setEnableAntiCsrf(true); // Enable/disable X-Requested-With header
 create.config.setEnableAutoXsrf(true); // Enable/disable automatic cookie-to-header token
+
+// Reset all configuration to defaults
+create.config.reset();
 ```
 
 ### Per-Request CSRF Settings
@@ -557,21 +715,12 @@ You can also configure CSRF protection on individual requests:
 ```typescript
 // Configure CSRF for a specific request
 const request = create
-  .post()
+  .post("https://api.example.com/users")
   .withCsrfToken("request-specific-token") // Set a specific token
   .withAntiCsrfHeaders() // Explicitly add X-Requested-With header
   .withoutCsrfProtection(); // Or disable all automatic CSRF protection
 ```
 
-### Integrating with Backend Frameworks
-
-Most modern frameworks support CSRF protection out of the box. The library works seamlessly with:
-
-- **Laravel**: Automatically reads XSRF-TOKEN cookie and sends X-XSRF-TOKEN header
-- **Rails**: Works with the Rails CSRF token system
-- **Django**: Compatible with Django's CSRF middleware
-- **Express.js + csurf**: Works with the csurf middleware token pattern
-
 ## Performance Considerations
 
 create-request is designed to be lightweight and efficient:
@@ -580,7 +729,7 @@ create-request is designed to be lightweight and efficient:
 - **Tree-Shakable**: Only import what you need
 - **Minimal Overhead**: Thin wrapper around the native Fetch API
 - **Memory Efficient**: Doesn't create unnecessary objects
-- **Cache Management**: Configurable caching to reduce network requests
+- **Clean API**: Simple and intuitive interface
 
 ## Browser Support
 
@@ -596,13 +745,12 @@ This library works with all browsers that support the Fetch API:
 
 | Feature             | create-request | Fetch  | Axios   | SuperAgent | Got     | Ky     | node-fetch | Redaxios |
 | ------------------- | -------------- | ------ | ------- | ---------- | ------- | ------ | ---------- | -------- |
-| **Size (min+gzip)** | ~5.1KB         | Native | ~13.6KB | ~17.8KB    | ~17.8KB | ~3.4KB | ~7.7KB     | ~1KB     |
+| **Size (min+gzip)** | ~5.5KB         | Native | ~13.6KB | ~17.8KB    | ~17.8KB | ~3.4KB | ~7.7KB     | ~1KB     |
 | **Browser**         | Modern         | Modern | IE11+   | IE9+       | ❌ No   | Modern | ❌ No      | Modern   |
 | **Node.js**         | ✅             | ✅     | ✅      | ✅         | ✅      | ✅     | ✅         | ✅       |
 | **HTTP/2**          | ✅             | ✅     | ✅      | ✅         | ✅      | ✅     | ❌         | ❌       |
 | **Auto Retries**    | ✅             | ❌     | 🛠️      | ✅         | ✅      | ✅     | ❌         | ❌       |
 | **Cancellation**    | ✅             | ✅     | ✅      | ✅         | ✅      | ✅     | ✅         | ✅       |
-| **Caching**         | ✅             | ❌     | ❌      | ✅         | ✅      | ❌     | ❌         | ❌       |
 | **Auto JSON**       | ✅             | ❌     | ✅      | ✅         | ✅      | ✅     | ❌         | ✅       |
 | **Timeout**         | ✅             | ❌     | ✅      | ✅         | ✅      | ✅     | ✅         | ✅       |
 | **TypeScript**      | ✅             | ✅     | ✅      | ✅         | ✅      | ✅     | ✅         | ✅       |
@@ -614,6 +762,8 @@ This library works with all browsers that support the Fetch API:
 | **Zero Deps**       | ✅             | ✅     | ❌      | ❌         | ❌      | ✅     | ✅         | ✅       |
 | **Chainable API**   | ✅             | ❌     | ❌      | ✅         | ✅      | ✅     | ❌         | ❌       |
 | **CSRF Protection** | ✅             | ❌     | ✅      | ❌         | ❌      | ❌     | ❌         | ❌       |
+| **GraphQL Support** | ✅             | ❌     | ❌      | ❌         | ❌      | ❌     | ❌         | ❌       |
+| **Interceptors**    | ✅             | ❌     | ✅      | ✅         | ✅      | ✅     | ❌         | ❌       |
 
 **Notes:**