@abpjs/theme-shared 2.7.0 → 3.0.0

package/dist/components/loader-bar/LoaderBar.d.ts

@@ -42,5 +42,5 @@ export interface LoaderBarProps {
  * />
  * ```
  */
-export declare function LoaderBar({ containerClass, progressClass, filter, intervalPeriod, stopDelay, }: LoaderBarProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function LoaderBar({ containerClass, progressClass, filter: _filter, intervalPeriod, stopDelay, }: LoaderBarProps): import("react/jsx-runtime").JSX.Element | null;
 export default LoaderBar;

package/dist/constants/styles.d.ts

@@ -7,6 +7,8 @@
  * - Added sorting icon styles
  * - Added table scrollbar width styling
  *
+ * @since 2.9.0 - Added RTL support for data-tables-filter
+ *
  * @example
  * ```tsx
  * // Option 1: Use with a style tag in your app
@@ -25,5 +27,11 @@
  * // Copy the content of DEFAULT_STYLES to your styles.css
  * ```
  */
-export declare const DEFAULT_STYLES = "\n.is-invalid .form-control {\n  border-color: #dc3545;\n  border-style: solid !important;\n}\n\n.is-invalid .invalid-feedback,\n.is-invalid + * .invalid-feedback {\n  display: block;\n}\n\n.data-tables-filter {\n  text-align: right;\n}\n\n.pointer {\n  cursor: pointer;\n}\n\n.navbar .dropdown-submenu a::after {\n  transform: rotate(-90deg);\n  position: absolute;\n  right: 16px;\n  top: 18px;\n}\n\n.navbar .dropdown-menu {\n  min-width: 215px;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar {\n  height: 5px !important;\n  width: 5px !important;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-track {\n  background: #ddd;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-thumb {\n  background: #8a8686;\n}\n\n.abp-ellipsis-inline {\n  display: inline-block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.abp-ellipsis {\n  overflow: hidden !important;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.ui-widget-overlay {\n  z-index: 1000;\n}\n\n.color-white {\n  color: #FFF !important;\n}\n\n.custom-checkbox > label {\n  cursor: pointer;\n}\n\n/* <animations */\n\n.fade-in-top {\n  animation: fadeInTop 0.2s ease-in-out;\n}\n\n.fade-out-top {\n  animation: fadeOutTop 0.2s ease-in-out;\n}\n\n.abp-collapsed-height {\n  -moz-transition: max-height linear 0.35s;\n  -ms-transition: max-height linear 0.35s;\n  -o-transition: max-height linear 0.35s;\n  -webkit-transition: max-height linear 0.35s;\n  overflow:hidden;\n  transition:max-height 0.35s linear;\n  height:auto;\n  max-height: 0;\n}\n\n.abp-mh-25 {\n  max-height: 25vh;\n}\n\n.abp-mh-50 {\n  transition:max-height 0.65s linear;\n  max-height: 50vh;\n}\n\n.abp-mh-75 {\n  transition:max-height 0.85s linear;\n  max-height: 75vh;\n}\n\n.abp-mh-100 {\n  transition:max-height 1s linear;\n  max-height: 100vh;\n}\n\n/* Sorting icon styles - @since 2.0.0 */\n[class^=\"sorting\"] {\n  opacity: .3;\n  cursor: pointer;\n}\n[class^=\"sorting\"]:before {\n  right: 0.5rem;\n  content: \"\u2191\";\n}\n[class^=\"sorting\"]:after {\n  right: 0.5rem;\n  content: \"\u2193\";\n}\n\n.sorting_desc {\n  opacity: 1;\n}\n.sorting_desc:before {\n  opacity: .3;\n}\n\n.sorting_asc {\n  opacity: 1;\n}\n.sorting_asc:after {\n  opacity: .3;\n}\n\n@keyframes fadeInTop {\n  from {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n\n  to {\n    transform: translateY(0px);\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOutTop {\n  to {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n}\n\n/* </animations */\n\n/* Loader bar styles */\n.abp-loader-bar {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: 3px;\n  z-index: 9999;\n  background-color: rgba(0, 0, 0, 0.1);\n  overflow: hidden;\n}\n\n.abp-progress {\n  height: 100%;\n  background-color: #3182ce;\n  transition: width 0.3s ease-out;\n}\n";
+/**
+ * Bootstrap CSS file pattern with direction placeholder.
+ * Use with createLazyStyleHref to get the correct bootstrap CSS for RTL/LTR.
+ * @since 2.9.0
+ */
+export declare const BOOTSTRAP = "bootstrap-{{dir}}.min.css";
+export declare const DEFAULT_STYLES = "\n.is-invalid .form-control {\n  border-color: #dc3545;\n  border-style: solid !important;\n}\n\n.is-invalid .invalid-feedback,\n.is-invalid + * .invalid-feedback {\n  display: block;\n}\n\n.data-tables-filter {\n  text-align: right;\n}\n\n/* RTL support - @since 2.9.0 */\n[dir=rtl] .data-tables-filter {\n  text-align: left;\n}\n\n.pointer {\n  cursor: pointer;\n}\n\n.navbar .dropdown-submenu a::after {\n  transform: rotate(-90deg);\n  position: absolute;\n  right: 16px;\n  top: 18px;\n}\n\n.navbar .dropdown-menu {\n  min-width: 215px;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar {\n  height: 5px !important;\n  width: 5px !important;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-track {\n  background: #ddd;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-thumb {\n  background: #8a8686;\n}\n\n.abp-ellipsis-inline {\n  display: inline-block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.abp-ellipsis {\n  overflow: hidden !important;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.ui-widget-overlay {\n  z-index: 1000;\n}\n\n.color-white {\n  color: #FFF !important;\n}\n\n.custom-checkbox > label {\n  cursor: pointer;\n}\n\n/* <animations */\n\n.fade-in-top {\n  animation: fadeInTop 0.2s ease-in-out;\n}\n\n.fade-out-top {\n  animation: fadeOutTop 0.2s ease-in-out;\n}\n\n.abp-collapsed-height {\n  -moz-transition: max-height linear 0.35s;\n  -ms-transition: max-height linear 0.35s;\n  -o-transition: max-height linear 0.35s;\n  -webkit-transition: max-height linear 0.35s;\n  overflow:hidden;\n  transition:max-height 0.35s linear;\n  height:auto;\n  max-height: 0;\n}\n\n.abp-mh-25 {\n  max-height: 25vh;\n}\n\n.abp-mh-50 {\n  transition:max-height 0.65s linear;\n  max-height: 50vh;\n}\n\n.abp-mh-75 {\n  transition:max-height 0.85s linear;\n  max-height: 75vh;\n}\n\n.abp-mh-100 {\n  transition:max-height 1s linear;\n  max-height: 100vh;\n}\n\n/* Sorting icon styles - @since 2.0.0 */\n[class^=\"sorting\"] {\n  opacity: .3;\n  cursor: pointer;\n}\n[class^=\"sorting\"]:before {\n  right: 0.5rem;\n  content: \"\u2191\";\n}\n[class^=\"sorting\"]:after {\n  right: 0.5rem;\n  content: \"\u2193\";\n}\n\n.sorting_desc {\n  opacity: 1;\n}\n.sorting_desc:before {\n  opacity: .3;\n}\n\n.sorting_asc {\n  opacity: 1;\n}\n.sorting_asc:after {\n  opacity: .3;\n}\n\n@keyframes fadeInTop {\n  from {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n\n  to {\n    transform: translateY(0px);\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOutTop {\n  to {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n}\n\n/* </animations */\n\n/* Loader bar styles */\n.abp-loader-bar {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: 3px;\n  z-index: 9999;\n  background-color: rgba(0, 0, 0, 0.1);\n  overflow: hidden;\n}\n\n.abp-progress {\n  height: 100%;\n  background-color: #3182ce;\n  transition: width 0.3s ease-out;\n}\n";
 export default DEFAULT_STYLES;

package/dist/enums/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Enums barrel export
+ * @since 3.0.0
+ */
+export * from './route-names';

package/dist/enums/route-names.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Theme Shared Route Names
+ * Translated from @abp/ng.theme.shared/lib/enums/route-names.ts v3.0.0
+ *
+ * @since 3.0.0
+ */
+/**
+ * Enum for theme shared route names.
+ * These are used for navigation and route registration.
+ *
+ * @since 3.0.0
+ */
+export declare enum eThemeSharedRouteNames {
+    Administration = "AbpUiNavigation::Menu:Administration"
+}

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

@@ -1,4 +1,4 @@
-import { Toaster } from '../models';
+import { Confirmation } from '../models';
 import { ErrorComponentProps } from '../components/errors/ErrorComponent';
 type NavigateFunction = (to: string) => void;
 /**
@@ -28,12 +28,13 @@ export interface ErrorComponentInstance {
 }
 /**
  * Error handler interface.
+ * @since 3.0.0 - showError now returns Confirmation.Status instead of Toaster.Status
  */
 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>;
+    showError: (message: string, title?: string) => Promise<Confirmation.Status>;
     /** Navigate to the login page */
     navigateToLogin: () => void;
     /** Create error component props for full-page error display */

package/dist/handlers/index.d.ts

@@ -1 +1,2 @@
 export * from './error.handler';
+export * from './lazy-style.handler';

package/dist/handlers/lazy-style.handler.d.ts

@@ -0,0 +1,96 @@
+/**
+ * Lazy Style Handler
+ * Translated from @abp/ng.theme.shared/lib/handlers/lazy-style.handler.ts
+ *
+ * Handles RTL/LTR style switching based on locale direction.
+ *
+ * @since 2.9.0
+ */
+import type { LocaleDirection } from '../models/common';
+/**
+ * Creates a lazy style href by replacing the direction placeholder.
+ * @param style - The style pattern with {{dir}} placeholder
+ * @param dir - The direction ('ltr' or 'rtl')
+ * @returns The resolved style href
+ * @since 2.9.0
+ *
+ * @example
+ * ```tsx
+ * const href = createLazyStyleHref('bootstrap-{{dir}}.min.css', 'rtl');
+ * // Returns: 'bootstrap-rtl.min.css'
+ * ```
+ */
+export declare function createLazyStyleHref(style: string, dir: string): string;
+/**
+ * Options for the LazyStyleHandler hook.
+ * @since 2.9.0
+ */
+export interface LazyStyleHandlerOptions {
+    /**
+     * Array of style patterns with {{dir}} placeholder.
+     * Defaults to [BOOTSTRAP] if not provided.
+     */
+    styles?: string[];
+    /**
+     * Initial direction. Defaults to 'ltr'.
+     */
+    initialDirection?: LocaleDirection;
+}
+/**
+ * Hook for managing RTL/LTR style switching.
+ * Automatically switches Bootstrap and other stylesheets based on locale direction.
+ *
+ * @param options - Configuration options
+ * @returns Object with current direction and setDirection function
+ * @since 2.9.0
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   const { direction, setDirection } = useLazyStyleHandler({
+ *     styles: [BOOTSTRAP],
+ *     initialDirection: 'ltr',
+ *   });
+ *
+ *   // Switch to RTL when needed
+ *   const handleLanguageChange = (lang: string) => {
+ *     if (lang === 'ar' || lang === 'he') {
+ *       setDirection('rtl');
+ *     } else {
+ *       setDirection('ltr');
+ *     }
+ *   };
+ *
+ *   return <div dir={direction}>...</div>;
+ * }
+ * ```
+ */
+export declare function useLazyStyleHandler(options?: LazyStyleHandlerOptions): {
+    direction: LocaleDirection;
+    setDirection: import("react").Dispatch<import("react").SetStateAction<LocaleDirection>>;
+};
+/**
+ * Gets the currently loaded Bootstrap stylesheet direction.
+ * @param styles - Array of style patterns to check
+ * @returns The current direction or undefined if not loaded
+ * @since 2.9.0
+ */
+export declare function getLoadedBootstrapDirection(styles?: string[]): LocaleDirection | undefined;
+/**
+ * Initialize lazy style handler for use in providers.
+ * Returns a function that creates the handler.
+ *
+ * @param options - Configuration options
+ * @returns Function that initializes the handler
+ * @since 2.9.0
+ *
+ * @example
+ * ```tsx
+ * // In your provider setup
+ * const initHandler = initLazyStyleHandler({ styles: [BOOTSTRAP] });
+ * const handler = initHandler();
+ * ```
+ */
+export declare function initLazyStyleHandler(options?: LazyStyleHandlerOptions): () => {
+    direction: LocaleDirection;
+};

package/dist/hooks/index.d.ts

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

package/dist/hooks/use-nav-items.d.ts

@@ -0,0 +1,33 @@
+/**
+ * useNavItems Hook
+ * @since 3.0.0
+ *
+ * React hook for subscribing to NavItemsService changes.
+ */
+import { NavItem } from '../models/nav-item';
+import { NavItemsService } from '../services/nav-items.service';
+/**
+ * Hook to subscribe to nav items from NavItemsService.
+ * Returns the current sorted array of nav items.
+ *
+ * @param service - Optional NavItemsService instance (defaults to singleton)
+ * @returns Array of NavItem objects, sorted by order
+ *
+ * @since 3.0.0
+ *
+ * @example
+ * ```tsx
+ * function MyNavComponent() {
+ *   const navItems = useNavItems();
+ *
+ *   return (
+ *     <ul>
+ *       {navItems.map((item) => (
+ *         <li key={item.id}>{item.id}</li>
+ *       ))}
+ *     </ul>
+ *   );
+ * }
+ * ```
+ */
+export declare function useNavItems(service?: NavItemsService): NavItem[];

package/dist/index.d.ts

@@ -2,11 +2,34 @@
  * @abpjs/theme-shared
  *
  * ABP Framework Theme Shared components for React.
- * Translated from @abp/ng.theme.shared v2.7.0
+ * Translated from @abp/ng.theme.shared v3.0.0
  *
  * This package provides shared UI components, services, and utilities
  * for theme/modal management in ABP Framework React applications.
  *
+ * Changes in v3.0.0:
+ * - Added NavItemsService (replaces nav-items utility functions)
+ * - Added NavItem.id property (required unique identifier)
+ * - Changed NavItem.permission to NavItem.requiredPolicy
+ * - Added eThemeSharedRouteNames enum for route names
+ * - Added THEME_SHARED_ROUTE_PROVIDERS and configureRoutes
+ * - Added initializeThemeSharedRoutes for easy route setup
+ * - Removed Toaster.Status enum (use Confirmation.Status instead)
+ * - Removed Confirmation.Options.closable (use dismissible instead)
+ * - Removed setting-management model (use @abpjs/core SettingTabsService)
+ * - Removed nav-items utils (use NavItemsService)
+ * - Dependency updates to @abp/ng.core v3.0.0
+ *
+ * Changes in v2.9.0:
+ * - Added LocaleDirection type for RTL/LTR support
+ * - Added LazyStyleHandler for RTL/LTR style switching
+ * - Added NavItem interface and functions (addNavItem, getNavItems, etc.)
+ * - Added LAZY_STYLES token and LazyStylesContext
+ * - Added BOOTSTRAP constant for bootstrap CSS pattern
+ * - Confirmation.Options: Added dismissible property, deprecated closable
+ * - Updated styles with RTL support for data-tables-filter
+ * - Dependency updates to @abp/ng.core v2.9.0
+ *
  * Changes in v2.7.0:
  * - Added ModalService with renderTemplate, clearModal, getContainer, detectChanges
  * - HttpErrorConfig: Added skipHandledErrorCodes, simplified forWhichErrors to array
@@ -68,3 +91,5 @@ export * from './providers';
 export * from './handlers';
 export * from './utils';
 export * from './theme';
+export * from './enums';
+export * from './services';