@abpjs/theme-shared 2.2.0 → 2.7.0

package/dist/components/errors/ErrorComponent.d.ts

@@ -9,11 +9,29 @@ export interface ErrorComponentProps {
     showCloseButton?: boolean;
     /** Custom close button text */
     closeButtonText?: string;
+    /**
+     * Whether to show the home button.
+     * When true, shows a "Go Home" button alongside or instead of the close button.
+     * @since 2.7.0
+     */
+    isHomeShow?: boolean;
+    /**
+     * Callback when user clicks the home button.
+     * @since 2.7.0
+     */
+    onHomeClick?: () => void;
+    /**
+     * Custom home button text.
+     * @since 2.7.0
+     */
+    homeButtonText?: string;
 }
 /**
  * A component for displaying error pages/messages.
  * Can be used for HTTP errors (404, 500, etc.) or general error states.
  *
+ * @since 2.7.0 - Added isHomeShow, onHomeClick, homeButtonText props
+ *
  * @example
  * ```tsx
  * // Basic error display
@@ -29,7 +47,15 @@ export interface ErrorComponentProps {
  *   showCloseButton
  *   onDestroy={() => navigate('/')}
  * />
+ *
+ * // With home button (v2.7.0)
+ * <ErrorComponent
+ *   title="404"
+ *   details="Page not found."
+ *   isHomeShow
+ *   onHomeClick={() => navigate('/')}
+ * />
  * ```
  */
-export declare function ErrorComponent({ title, details, onDestroy, showCloseButton, closeButtonText, }: ErrorComponentProps): import("react/jsx-runtime").JSX.Element;
+export declare function ErrorComponent({ title, details, onDestroy, showCloseButton, closeButtonText, isHomeShow, onHomeClick, homeButtonText, }: ErrorComponentProps): import("react/jsx-runtime").JSX.Element;
 export default ErrorComponent;

package/dist/constants/append-content.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Context for theme shared append content functionality.
+ * Used to append scripts or stylesheets to the document.
+ *
+ * This is the React equivalent of Angular's THEME_SHARED_APPEND_CONTENT InjectionToken.
+ *
+ * @since 2.4.0
+ *
+ * @example
+ * ```tsx
+ * // Provide a custom append content function
+ * import { ThemeSharedAppendContentContext } from '@abpjs/theme-shared';
+ *
+ * function App() {
+ *   const appendContent = async () => {
+ *     // Custom logic to append scripts/styles
+ *   };
+ *
+ *   return (
+ *     <ThemeSharedAppendContentContext.Provider value={appendContent}>
+ *       <YourApp />
+ *     </ThemeSharedAppendContentContext.Provider>
+ *   );
+ * }
+ * ```
+ */
+export declare const ThemeSharedAppendContentContext: import("react").Context<(() => Promise<void>) | undefined>;
+/**
+ * Token name constant for THEME_SHARED_APPEND_CONTENT.
+ * Matches the Angular InjectionToken name.
+ *
+ * @since 2.4.0
+ */
+export declare const THEME_SHARED_APPEND_CONTENT = "THEME_SHARED_APPEND_CONTENT";

package/dist/constants/index.d.ts

@@ -1 +1,2 @@
 export * from './styles';
+export * from './append-content';

package/dist/contexts/index.d.ts

@@ -1,2 +1,3 @@
 export * from './toaster.context';
 export * from './confirmation.context';
+export * from './modal.context';

package/dist/contexts/modal.context.d.ts

@@ -0,0 +1,139 @@
+import React, { type ReactNode, type ReactElement } from 'react';
+/**
+ * Modal template render function type.
+ * @since 2.7.0
+ */
+export type ModalTemplateRender<T = unknown> = (context?: T) => ReactElement | null;
+/**
+ * Modal state containing the current template and context.
+ * @since 2.7.0
+ */
+export interface ModalState<T = unknown> {
+    /** The render function for the modal content */
+    render: ModalTemplateRender<T>;
+    /** Context passed to the render function */
+    context?: T;
+}
+/**
+ * ModalService interface - matches the Angular service API.
+ *
+ * In Angular, ModalService uses ContentProjectionService to render templates
+ * in a container. In React, we use context and state to manage modal content.
+ *
+ * @since 2.7.0
+ */
+export interface ModalService {
+    /**
+     * Render a template in the modal container.
+     * @param render - Function that returns the modal content
+     * @param context - Optional context to pass to the render function
+     * @since 2.7.0
+     */
+    renderTemplate<T = unknown>(render: ModalTemplateRender<T>, context?: T): void;
+    /**
+     * Clear the current modal.
+     * @since 2.7.0
+     */
+    clearModal(): void;
+    /**
+     * Get the container ref for the modal.
+     * In React, this returns a ref to the container element.
+     * @since 2.7.0
+     */
+    getContainer(): React.RefObject<HTMLDivElement | null>;
+    /**
+     * Trigger a re-render of the modal content.
+     * In React, this forces a state update.
+     * @since 2.7.0
+     */
+    detectChanges(): void;
+}
+/**
+ * Context value containing the service and current modal state.
+ * @since 2.7.0
+ */
+export interface ModalContextValue {
+    service: ModalService;
+    /** Current modal state */
+    modalState: ModalState | null;
+}
+export interface ModalProviderProps {
+    children: ReactNode;
+}
+/**
+ * ModalProvider - Provides modal service functionality.
+ *
+ * This is the React equivalent of Angular's ModalService.
+ * Wrap your app with this provider to enable modal service functionality.
+ *
+ * @since 2.7.0
+ *
+ * @example
+ * ```tsx
+ * <ModalProvider>
+ *   <App />
+ *   <ModalContainer />
+ * </ModalProvider>
+ * ```
+ */
+export declare function ModalProvider({ children }: ModalProviderProps): ReactElement;
+/**
+ * Hook to access the modal service.
+ *
+ * @returns ModalService with methods to manage modal content
+ * @throws Error if used outside of ModalProvider
+ *
+ * @since 2.7.0
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const modal = useModal();
+ *
+ *   const openModal = () => {
+ *     modal.renderTemplate((context) => (
+ *       <Dialog open onClose={() => modal.clearModal()}>
+ *         <DialogContent>Hello {context?.name}</DialogContent>
+ *       </Dialog>
+ *     ), { name: 'World' });
+ *   };
+ *
+ *   return <button onClick={openModal}>Open Modal</button>;
+ * }
+ * ```
+ */
+export declare function useModal(): ModalService;
+/**
+ * Hook to access the current modal state.
+ * This is typically used by the ModalContainer component.
+ *
+ * @returns Current modal state or null
+ * @since 2.7.0
+ */
+export declare function useModalState(): ModalState | null;
+/**
+ * Hook to access the full modal context.
+ *
+ * @returns ModalContextValue with service and modal state
+ * @since 2.7.0
+ */
+export declare function useModalContext(): ModalContextValue;
+/**
+ * ModalContainer component - renders the current modal content.
+ * Place this component once in your app to display modal content.
+ *
+ * @since 2.7.0
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   return (
+ *     <ModalProvider>
+ *       <MainContent />
+ *       <ModalContainer />
+ *     </ModalProvider>
+ *   );
+ * }
+ * ```
+ */
+export declare function ModalContainer(): ReactElement | null;

package/dist/index.d.ts

@@ -2,11 +2,25 @@
  * @abpjs/theme-shared
  *
  * ABP Framework Theme Shared components for React.
- * Translated from @abp/ng.theme.shared v2.2.0
+ * Translated from @abp/ng.theme.shared v2.7.0
  *
  * This package provides shared UI components, services, and utilities
  * for theme/modal management in ABP Framework React applications.
  *
+ * Changes in v2.7.0:
+ * - Added ModalService with renderTemplate, clearModal, getContainer, detectChanges
+ * - HttpErrorConfig: Added skipHandledErrorCodes, simplified forWhichErrors to array
+ * - HttpErrorWrapperComponent: Added isHomeShow property
+ * - Added validation-utils with getPasswordValidators function
+ * - Added tokens exports (HTTP_ERROR_CONFIG, httpErrorConfigFactory)
+ * - Dependency updates to @abp/ng.core v2.7.0
+ *
+ * Changes in v2.4.0:
+ * - Added THEME_SHARED_APPEND_CONTENT token for content appending
+ * - Updated Toaster.Status deprecation notice (removal now in v3.0 instead of v2.2)
+ * - Dependency updates to @abp/ng.core v2.4.0
+ * - appendScript function deprecated (to be deleted in v2.6)
+ *
  * Changes in v2.2.0:
  * - Dependency updates to @abp/ng.core v2.2.0
  * - Dependency updates to @fortawesome/fontawesome-free v5.12.1
@@ -46,6 +60,7 @@
  */
 export * from './models';
 export * from './constants';
+export * from './tokens';
 export * from './contexts';
 export * from './hooks';
 export * from './components';