@hashrytech/quick-components-kit 0.14.3 → 0.15.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @hashrytech/quick-components-kit
 
+## 0.15.1
+
+### Patch Changes
+
+- chore: Adding extra logging text
+
+## 0.15.0
+
+### Minor Changes
+
+- refactor: Renaming ApiClient to FetchClient
+
 ## 0.14.3
 
 ### Patch Changes

package/dist/index.d.ts

@@ -12,7 +12,7 @@ export * from './actions/disable-scroll.js';
 export * from './actions/on-keydown.js';
 export * from './actions/lock-scroll.js';
 export * from './actions/scroll-to.js';
-export * from './modules/api-client.js';
+export * from './modules/fetch-client.js';
 export * from './modules/api-proxy.js';
 export * from './modules/crypto.js';
 export * from './modules/problem-details.js';

package/dist/index.js

@@ -14,7 +14,7 @@ export * from './actions/disable-scroll.js';
 export * from './actions/on-keydown.js';
 export * from './actions/lock-scroll.js';
 export * from './actions/scroll-to.js';
-export * from './modules/api-client.js';
+export * from './modules/fetch-client.js';
 export * from './modules/api-proxy.js';
 export * from './modules/crypto.js';
 export * from './modules/problem-details.js';

package/dist/modules/api-proxy.js

@@ -6,7 +6,7 @@ export const defaultResponseHeaders = ['content-type', 'content-length', 'cache-
  */
 export function createProxyHandlers(config) {
     if (config.debug)
-        console.debug("Creating proxy handlers with config:", config);
+        console.debug("API Proxy: Creating proxy handlers with config:", config);
     async function handler(event) {
         const path = event.params.path;
         const queryString = event.url.searchParams.toString();
@@ -14,7 +14,7 @@ export function createProxyHandlers(config) {
         const fullPath = `/${path}${slash}${queryString ? `?${queryString}` : ''}`;
         const url = `${config.host}${fullPath}`;
         if (config.debug)
-            console.debug(`Proxying request to: ${url}`);
+            console.debug(`API Proxy: Proxying ${event.request.method} request to: ${url}`);
         // Validate the path against allowed prefixes if specified
         if (config.allowedPaths && config.allowedPaths.length > 0) {
             const isAllowed = config.allowedPaths.some((prefix) => path?.startsWith(prefix));

package/dist/modules/{api-client.d.ts → fetch-client.d.ts}

@@ -15,19 +15,21 @@ export interface AutoRedirectRule {
     errorValue?: string;
     redirectTo: string;
 }
-export type ApiResponse<T> = {
+export type FetchResponse<T> = {
     ok: boolean;
     status: number;
     data?: T;
     error?: ProblemDetail;
 };
-export interface ApiClientConfig {
+export interface FetchClientConfig {
     /** The base URL for your API (e.g., 'https://api.yourapi.com/v1'). */
     baseURL: string;
     /** Default headers to be sent with every request. */
     defaultHeaders?: HeadersInit;
     /** Specified redirects if the response matches the specified rules. */
     autoRedirects?: AutoRedirectRule[];
+    /** Optional flag to enable debug logging */
+    debug?: boolean;
 }
 export interface RequestOptions extends RequestInit {
     /** If true, the Authorization header will not be added to this request. */
@@ -55,12 +57,12 @@ export type ErrorHandler = (error: Error) => Promise<void> | void;
  * Custom error class for API responses.
  * Provides access to the HTTP status code.
  */
-export declare class ApiError extends Error {
+export declare class FetchError extends Error {
     status: number;
     json?: object;
     constructor(message: string, status: number, json?: object);
 }
-export interface ApiClientEvents {
+export interface FetchClientEvents {
     onRequest?: (request: Request) => void;
     onResponse?: (response: Response) => void;
     onError?: (error: Error) => void;
@@ -78,8 +80,9 @@ export interface ApiClientEvents {
  * - Supports file downloads (returns Blob).
  * - Integrates with SvelteKit's `fetch` for server-side benefits.
  */
-export declare class ApiClient {
+export declare class FetchClient {
     private baseURL;
+    private debug;
     private defaultHeaders;
     private accessToken;
     private fetchInstance?;
@@ -92,8 +95,8 @@ export declare class ApiClient {
      * Creates an instance of ApiClient.
      * @param config - Configuration for the API client.
      */
-    constructor(config: ApiClientConfig & {
-        events?: ApiClientEvents;
+    constructor(config: FetchClientConfig & {
+        events?: FetchClientEvents;
     });
     /**
      * Sets the Bearer token for client-side requests.
@@ -122,7 +125,7 @@ export declare class ApiClient {
      * @param handler - A function that takes an `Error` object.
      */
     addErrorHandler(handler: ErrorHandler): void;
-    setEventHooks(events: Partial<ApiClientEvents>): void;
+    setEventHooks(events: Partial<FetchClientEvents>): void;
     /**
      * Processes the request, applying default headers, auth token, and request interceptors.
      * @param endpoint - The API endpoint (e.g., '/products', '/users/123').
@@ -155,7 +158,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response data or raw Response/Blob.
      * @template T - Expected type of the response data.
      */
-    request<T>(endpoint: string, method: string, body: BodyInit | object | null | undefined, options?: RequestOptions): Promise<ApiResponse<T>>;
+    request<T>(endpoint: string, method: string, body: BodyInit | object | null | undefined, options?: RequestOptions): Promise<FetchResponse<T>>;
     private evaluateRedirect;
     /**
      * Sends a GET request to the specified API endpoint.
@@ -165,7 +168,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response or raw Response object.
      * @template T - Expected shape of the JSON response.
      */
-    get<T>(endpoint: string, options?: RequestOptions): Promise<ApiResponse<T>>;
+    get<T>(endpoint: string, options?: RequestOptions): Promise<FetchResponse<T>>;
     /**
      * Sends a POST request to the specified API endpoint.
      *
@@ -175,7 +178,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response or raw Response object.
      * @template T - Expected shape of the JSON response.
      */
-    post<T>(endpoint: string, data?: BodyInit | object | null, options?: RequestOptions): Promise<ApiResponse<T>>;
+    post<T>(endpoint: string, data?: BodyInit | object | null, options?: RequestOptions): Promise<FetchResponse<T>>;
     /**
      * Sends a PUT request to the specified API endpoint.
      * Typically used for full resource replacement.
@@ -186,7 +189,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response or raw Response object.
      * @template T - Expected shape of the JSON response.
      */
-    put<T>(endpoint: string, data?: BodyInit | object | null, options?: RequestOptions): Promise<ApiResponse<T>>;
+    put<T>(endpoint: string, data?: BodyInit | object | null, options?: RequestOptions): Promise<FetchResponse<T>>;
     /**
      * Sends a PATCH request to the specified API endpoint.
      * Typically used for partial updates.
@@ -197,7 +200,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response or raw Response object.
      * @template T - Expected shape of the JSON response.
      */
-    patch<T>(endpoint: string, data?: BodyInit | object | null, options?: RequestOptions): Promise<ApiResponse<T>>;
+    patch<T>(endpoint: string, data?: BodyInit | object | null, options?: RequestOptions): Promise<FetchResponse<T>>;
     /**
      * Sends a DELETE request to the specified API endpoint.
      *
@@ -206,7 +209,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response or raw Response object.
      * @template T - Expected shape of the JSON response (if any).
      */
-    delete<T>(endpoint: string, options?: RequestOptions): Promise<ApiResponse<T>>;
+    delete<T>(endpoint: string, options?: RequestOptions): Promise<FetchResponse<T>>;
     /**
      * Handles file uploads.
      * @param endpoint - The API endpoint for file upload.
@@ -216,7 +219,7 @@ export declare class ApiClient {
      * @returns A Promise resolving to the parsed response data.
      * @template T - Expected type of the response data after upload.
      */
-    uploadFile<T>(endpoint: string, file: File | Blob | FormData, fieldName?: string, options?: RequestOptions): Promise<ApiResponse<T>>;
+    uploadFile<T>(endpoint: string, file: File | Blob | FormData, fieldName?: string, options?: RequestOptions): Promise<FetchResponse<T>>;
     /**
      * Handles file downloads.
      * @param endpoint - The API endpoint for file download.

package/dist/modules/{api-client.js → fetch-client.js}

@@ -6,12 +6,12 @@ import { browser } from "$app/environment";
  * Custom error class for API responses.
  * Provides access to the HTTP status code.
  */
-export class ApiError extends Error {
+export class FetchError extends Error {
     status;
     json;
     constructor(message, status, json) {
         super(message);
-        this.name = 'ApiError';
+        this.name = 'FetchError';
         this.status = status;
         this.json = json;
     }
@@ -29,8 +29,9 @@ export class ApiError extends Error {
  * - Supports file downloads (returns Blob).
  * - Integrates with SvelteKit's `fetch` for server-side benefits.
  */
-export class ApiClient {
+export class FetchClient {
     baseURL;
+    debug = false;
     defaultHeaders;
     accessToken;
     fetchInstance;
@@ -47,6 +48,7 @@ export class ApiClient {
         this.baseURL = config.baseURL;
         this.defaultHeaders = config.defaultHeaders || { 'Content-Type': 'application/json' };
         this.autoRedirects = config.autoRedirects || [];
+        this.debug = config.debug || false;
     }
     /**
      * Sets the Bearer token for client-side requests.
@@ -98,6 +100,8 @@ export class ApiClient {
      */
     async processRequest(endpoint, method, body, options) {
         const url = this.baseURL ? new URL(endpoint, this.baseURL).toString() : endpoint; // Resolve endpoint relative to baseURL
+        if (this.debug)
+            console.debug(`Fetch Client: Processing request to ${url} with method ${method}`);
         const requestHeaders = new Headers(this.defaultHeaders);
         // Merge custom headers from options using Headers constructor for robustness
         if (options.headers) {
@@ -172,7 +176,7 @@ export class ApiClient {
                 // If response is not JSON, use default status text or log parsing error
                 console.warn('API Client: Failed to parse error response as JSON.', e);
             }
-            throw new ApiError(errorMessage, response.status, errorJson);
+            throw new FetchError(errorMessage, response.status, errorJson);
         }
         switch (options.responseType) {
             case 'text':
@@ -224,6 +228,8 @@ export class ApiClient {
      * @template T - Expected type of the response data.
      */
     async request(endpoint, method, body, options = {}) {
+        if (this.debug)
+            console.debug(`Fetch Client: ${options.fetchInstance || this.fetchInstance ? "Using sveltekit fetch instance..." : "Using default fetch instance"}`);
         const currentFetch = options.fetchInstance || this.fetchInstance || fetch; // Use provided fetch first then the class instance fetch or the global fetch if not specified.
         try {
             const request = await this.processRequest(endpoint, method, body, options);
@@ -236,8 +242,10 @@ export class ApiClient {
             };
         }
         catch (error) {
+            if (this.debug)
+                console.debug(`Fetch Client: Error occurred while processing request to ${endpoint} with method ${method}`, error);
             await this.handleError(error);
-            const isApiError = error instanceof ApiError;
+            const isApiError = error instanceof FetchError;
             const status = isApiError ? error.status : 503; // Service Unavailable fallback
             const message = error instanceof Error ? error.message : 'Unexpected error occurred';
             const errorObj = isApiError && error.json ? error.json : getProblemDetail({ status, title: "Server fetch error", type: "/exceptions/fetch-error/", detail: message });
@@ -254,6 +262,8 @@ export class ApiClient {
         for (const rule of this.autoRedirects) {
             // Checks if the error matches the redirect rule value can be undefined to match if no value is specified.
             if (status === rule.status && rule.errorKey in errorObj && (rule.errorValue === undefined || errorObj[rule.errorKey] === rule.errorValue)) {
+                if (this.debug)
+                    console.debug(`Fetch Client: Redirecting to ${rule.redirectTo} for status ${status} with error key "${rule.errorKey}" and value "${rule.errorValue}"`);
                 if (browser) {
                     // Client-side redirect
                     import('$app/navigation').then(({ goto }) => {
@@ -435,7 +445,7 @@ export class ApiClient {
                     }
                 }
                 else {
-                    reject(new ApiError(xhr.statusText, xhr.status));
+                    reject(new FetchError(xhr.statusText, xhr.status));
                 }
             };
             xhr.onerror = () => reject(new Error('Upload failed'));

package/package.json

@@ -5,7 +5,7 @@
     "type": "git",
     "url": "git+https://github.com/hashrytech/quick-components-kit.git"
   },
-  "version": "0.14.3",
+  "version": "0.15.1",
   "license": "MIT",
   "author": "Hashry Tech",
   "files": [