@abpjs/theme-shared 0.7.6

package/dist/handlers/error.handler.d.ts

@@ -0,0 +1,110 @@
+import { Toaster } from '../models';
+type NavigateFunction = (to: string) => void;
+/**
+ * HTTP error response structure (matching ABP error format).
+ */
+export interface HttpErrorResponse {
+    status: number;
+    statusText?: string;
+    error?: {
+        error?: {
+            message?: string;
+            details?: string;
+            code?: string;
+            validationErrors?: Array<{
+                message: string;
+                members: string[];
+            }>;
+        };
+    };
+}
+/**
+ * Error handler interface.
+ */
+export interface ErrorHandler {
+    /** Handle an HTTP error response */
+    handleError: (error: HttpErrorResponse) => Promise<void>;
+    /** Show an error message in a confirmation dialog */
+    showError: (message: string, title?: string) => Promise<Toaster.Status>;
+    /** Navigate to the login page */
+    navigateToLogin: () => void;
+}
+export interface UseErrorHandlerOptions {
+    /**
+     * Custom navigate function. If not provided, navigation to login will be a no-op.
+     * Pass `useNavigate()` from react-router-dom if you want navigation support.
+     */
+    navigate?: NavigateFunction;
+    /**
+     * Custom login path. Defaults to '/account/login'.
+     */
+    loginPath?: string;
+}
+/**
+ * useErrorHandler - Hook for global error handling.
+ *
+ * This is the React equivalent of Angular's ErrorHandler service.
+ * It provides methods to handle HTTP errors and display error dialogs.
+ *
+ * @param options - Optional configuration including navigate function
+ *
+ * @example
+ * ```tsx
+ * import { useNavigate } from 'react-router-dom';
+ *
+ * function MyComponent() {
+ *   const navigate = useNavigate();
+ *   const errorHandler = useErrorHandler({ navigate });
+ *
+ *   const handleApiCall = async () => {
+ *     try {
+ *       await fetchData();
+ *     } catch (error) {
+ *       await errorHandler.handleError(error as HttpErrorResponse);
+ *     }
+ *   };
+ *
+ *   return <button onClick={handleApiCall}>Fetch</button>;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Without navigation (will only show error dialogs)
+ * function MyComponent() {
+ *   const errorHandler = useErrorHandler();
+ *   // 401 errors will show dialog but won't redirect
+ * }
+ * ```
+ */
+export declare function useErrorHandler(options?: UseErrorHandlerOptions): ErrorHandler;
+/**
+ * createErrorInterceptor - Creates an axios response error interceptor.
+ *
+ * This can be used to set up global error handling for axios.
+ *
+ * @param errorHandler - The error handler to use
+ * @returns An error interceptor function
+ *
+ * @example
+ * ```tsx
+ * function SetupInterceptors() {
+ *   const errorHandler = useErrorHandler();
+ *
+ *   useEffect(() => {
+ *     const interceptor = axios.interceptors.response.use(
+ *       (response) => response,
+ *       createErrorInterceptor(errorHandler)
+ *     );
+ *
+ *     return () => {
+ *       axios.interceptors.response.eject(interceptor);
+ *     };
+ *   }, [errorHandler]);
+ *
+ *   return null;
+ * }
+ * ```
+ */
+export declare function createErrorInterceptor(errorHandler: ErrorHandler): (error: unknown) => Promise<never>;
+export default useErrorHandler;

package/dist/handlers/index.d.ts

@@ -0,0 +1 @@
+export * from './error.handler';

package/dist/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export { useToaster, useToasts, useToasterContext } from '../contexts/toaster.context';
+export { useConfirmation, useConfirmationState, useConfirmationContext } from '../contexts/confirmation.context';
+export { useErrorHandler } from '../handlers/error.handler';

package/dist/index.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @abpjs/theme-shared
+ *
+ * ABP Framework Theme Shared components for React.
+ * Translated from @abp/ng.theme.shared v0.7.6
+ *
+ * This package provides shared UI components, services, and utilities
+ * for theme/modal management in ABP Framework React applications.
+ */
+export * from './models';
+export * from './contexts';
+export * from './hooks';
+export * from './components';
+export * from './providers';
+export * from './handlers';
+export * from './utils';
+export * from './theme';