@abpjs/theme-shared 3.1.0 → 4.0.0

package/dist/components/modal/Modal.d.ts

@@ -54,6 +54,13 @@ export interface ModalProps {
      * @default true
      */
     preventScroll?: boolean;
+    /**
+     * Whether to suppress the unsaved changes warning when closing the modal.
+     * When true, the modal will close without prompting for unsaved changes.
+     * @default false
+     * @since 4.0.0
+     */
+    suppressUnsavedChangesWarning?: boolean;
 }
 /**
  * Modal component - Generic modal/dialog container.

package/dist/constants/styles.d.ts

@@ -9,6 +9,9 @@
  *
  * @since 2.9.0 - Added RTL support for data-tables-filter
  *
+ * @since 3.2.0 - Added .datatable-scroll styles for ngx-datatable horizontal scroll fix
+ * @since 4.0.0 - Enhanced .is-invalid .form-control with error icon, added typeahead styles
+ *
  * @example
  * ```tsx
  * // Option 1: Use with a style tag in your app
@@ -33,5 +36,5 @@
  * @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 declare const DEFAULT_STYLES = "\n/* Enhanced validation styles - @since 4.0.0 */\n.is-invalid .form-control {\n  border-color: #dc3545;\n  border-style: solid !important;\n  padding-right: calc(1.5em + .75rem);\n  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e);\n  background-repeat: no-repeat;\n  background-position: right calc(.375em + .1875rem) center;\n  background-size: calc(.75em + .375rem) calc(.75em + .375rem);\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/* ngx-datatable scroll fix - @since 3.2.0 */\n.datatable-scroll {\n  margin-bottom: 5px !important;\n  width: unset !important;\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.ngx-datatable.material {\n  box-shadow: none;\n}\n/* Typeahead dropdown styles - @since 4.0.0 */\n.abp-typeahead-window {\n  width: 100%;\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/contexts/confirmation.context.d.ts

@@ -1,5 +1,5 @@
 import React, { type ReactNode } from 'react';
-import type { Config } from '@abpjs/core';
+import type { LocalizationParam } from '@abpjs/core';
 import { Confirmation } from '../models';
 /**
  * Subscriber callback type for confirmation$ observable pattern
@@ -11,7 +11,7 @@ type ConfirmationSubscriber = (data: Confirmation.DialogData | null) => void;
  * @since 2.0.0 - Major changes:
  * - No longer extends AbstractToaster
  * - Added confirmation$ ReplaySubject pattern via subscribe method
- * - Now accepts Config.LocalizationParam for message and title
+ * - Now accepts LocalizationParam for message and title
  *
  * @since 2.1.0 - Changed from Toaster.Status to Confirmation.Status
  */
@@ -23,7 +23,7 @@ export interface ConfirmationService {
      * @param options Confirmation options
      * @returns Promise resolving to user's response status
      */
-    info(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
+    info(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
     /**
      * Show a success confirmation
      * @param message Message content (supports localization)
@@ -31,7 +31,7 @@ export interface ConfirmationService {
      * @param options Confirmation options
      * @returns Promise resolving to user's response status
      */
-    success(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
+    success(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
     /**
      * Show a warning confirmation
      * @param message Message content (supports localization)
@@ -39,7 +39,7 @@ export interface ConfirmationService {
      * @param options Confirmation options
      * @returns Promise resolving to user's response status
      */
-    warn(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
+    warn(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
     /**
      * Show an error confirmation
      * @param message Message content (supports localization)
@@ -47,7 +47,7 @@ export interface ConfirmationService {
      * @param options Confirmation options
      * @returns Promise resolving to user's response status
      */
-    error(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
+    error(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
     /**
      * Show a confirmation with specified severity
      * @param message Message content (supports localization)
@@ -58,7 +58,7 @@ export interface ConfirmationService {
      * @since 2.0.0
      * @since 2.1.0 - Uses Confirmation.Severity instead of Toaster.Severity
      */
-    show(message: Config.LocalizationParam, title?: Config.LocalizationParam, severity?: Confirmation.Severity, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
+    show(message: LocalizationParam, title?: LocalizationParam, severity?: Confirmation.Severity, options?: Partial<Confirmation.Options>): Promise<Confirmation.Status>;
     /**
      * Clear the current confirmation
      * @param status Optional status to resolve with (default: dismiss)
@@ -99,7 +99,7 @@ export interface ConfirmationProviderProps {
  * Wrap your app with this provider to enable confirmation dialogs.
  *
  * @since 2.0.0 - Major changes:
- * - Now accepts Config.LocalizationParam for message and title
+ * - Now accepts LocalizationParam for message and title
  * - Added subscribe method for observable pattern
  * - Added listenToEscape method
  * - Uses Confirmation.DialogData structure
@@ -121,7 +121,7 @@ export declare function ConfirmationProvider({ children }: ConfirmationProviderP
  * @returns ConfirmationService with methods to show confirmation dialogs
  * @throws Error if used outside of ConfirmationProvider
  *
- * @since 2.0.0 - Service now accepts Config.LocalizationParam
+ * @since 2.0.0 - Service now accepts LocalizationParam
  * @since 2.1.0 - Uses Confirmation.Status instead of Toaster.Status
  *
  * @example

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

@@ -1,5 +1,5 @@
 import React, { type ReactNode } from 'react';
-import type { Config } from '@abpjs/core';
+import type { LocalizationParam, Strict } from '@abpjs/core';
 import { Toaster } from '../models';
 /**
  * Internal toast with numeric ID for tracking.
@@ -20,6 +20,7 @@ type ToastsSubscriber = (toasts: Toaster.Toast[]) => void;
  * - Methods now return number (toast ID) instead of Observable<Status>
  * - Added toasts$ ReplaySubject pattern via subscribe method
  * - Removed addAll method (use show directly)
+ * @since 4.0.0 - Methods use LocalizationParam, return Toaster.ToasterId
  */
 export interface ToasterService {
     /**
@@ -28,36 +29,32 @@ export interface ToasterService {
      * @param title Title of the toast
      * @param options Specific style or structural options for individual toast
      * @returns Toast ID
-     * @since 2.0.0 - Now returns number instead of Promise<Status>
      */
-    info(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Toaster.ToastOptions>): number;
+    info(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Toaster.ToastOptions>): Toaster.ToasterId;
     /**
      * Creates a success toast with given parameters.
      * @param message Content of the toast
      * @param title Title of the toast
      * @param options Specific style or structural options for individual toast
      * @returns Toast ID
-     * @since 2.0.0 - Now returns number instead of Promise<Status>
      */
-    success(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Toaster.ToastOptions>): number;
+    success(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Toaster.ToastOptions>): Toaster.ToasterId;
     /**
      * Creates a warning toast with given parameters.
      * @param message Content of the toast
      * @param title Title of the toast
      * @param options Specific style or structural options for individual toast
      * @returns Toast ID
-     * @since 2.0.0 - Now returns number instead of Promise<Status>
      */
-    warn(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Toaster.ToastOptions>): number;
+    warn(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Toaster.ToastOptions>): Toaster.ToasterId;
     /**
      * Creates an error toast with given parameters.
      * @param message Content of the toast
      * @param title Title of the toast
      * @param options Specific style or structural options for individual toast
      * @returns Toast ID
-     * @since 2.0.0 - Now returns number instead of Promise<Status>
      */
-    error(message: Config.LocalizationParam, title?: Config.LocalizationParam, options?: Partial<Toaster.ToastOptions>): number;
+    error(message: LocalizationParam, title?: LocalizationParam, options?: Partial<Toaster.ToastOptions>): Toaster.ToasterId;
     /**
      * Creates a toast with given parameters.
      * @param message Content of the toast
@@ -65,29 +62,31 @@ export interface ToasterService {
      * @param severity Sets color of the toast. "success", "warning" etc.
      * @param options Specific style or structural options for individual toast
      * @returns Toast ID
-     * @since 2.0.0
      */
-    show(message: Config.LocalizationParam, title?: Config.LocalizationParam, severity?: Toaster.Severity, options?: Partial<Toaster.ToastOptions>): number;
+    show(message: LocalizationParam, title?: LocalizationParam, severity?: Toaster.Severity, options?: Partial<Toaster.ToastOptions>): Toaster.ToasterId;
     /**
      * Removes the toast with given id.
      * @param id ID of the toast to be removed.
-     * @since 2.0.0
      */
     remove(id: number): void;
     /**
      * Removes all open toasts at once.
-     * @param key Optional container key to clear toasts from specific container
-     * @since 2.0.0
+     * @param containerKey Optional container key to clear toasts from specific container
+     * @since 4.0.0 - Renamed parameter from key to containerKey
      */
-    clear(key?: string): void;
+    clear(containerKey?: string): void;
     /**
      * Subscribe to toast updates (mimics RxJS ReplaySubject pattern).
      * @param subscriber Callback function called with current toasts
      * @returns Unsubscribe function
-     * @since 2.0.0
      */
     subscribe(subscriber: ToastsSubscriber): () => void;
 }
+/**
+ * Type constraint ensuring ToasterService satisfies the Toaster.Service contract.
+ * @since 4.0.0
+ */
+export type ToasterContract = Strict<ToasterService, Toaster.Service>;
 /**
  * Context value containing the service and current toasts.
  */

package/dist/index.d.ts

@@ -2,11 +2,30 @@
  * @abpjs/theme-shared
  *
  * ABP Framework Theme Shared components for React.
- * Translated from @abp/ng.theme.shared v3.0.0
+ * Translated from @abp/ng.theme.shared v4.0.0
  *
  * This package provides shared UI components, services, and utilities
  * for theme/modal management in ABP Framework React applications.
  *
+ * Changes in v4.0.0:
+ * - Toaster.Toast now uses LocalizationParam instead of Config.LocalizationParam
+ * - Added Toaster.ToasterId type (string | number)
+ * - Added Toaster.Service interface (contract for toaster implementations)
+ * - Added ToasterContract type (Strict<ToasterService, Toaster.Service>)
+ * - Confirmation.Options: cancelText/yesText now use LocalizationParam
+ * - ConfirmationService/ToasterService: parameters use LocalizationParam
+ * - ToasterService methods now return Toaster.ToasterId
+ * - ToasterService.clear parameter renamed from key to containerKey
+ * - Added SUPPRESS_UNSAVED_CHANGES_WARNING token and context
+ * - Added suppressUnsavedChangesWarning prop to Modal component
+ * - Enhanced form validation styles with error icon SVG
+ * - Added typeahead dropdown styles
+ * - Dependency updates to @abp/ng.core v4.0.0
+ *
+ * Changes in v3.2.0:
+ * - Added .datatable-scroll CSS styles for ngx-datatable horizontal scroll fix
+ * - Dependency updates to @abp/ng.core v3.2.0
+ *
  * Changes in v3.0.0:
  * - Added NavItemsService (replaces nav-items utility functions)
  * - Added NavItem.id property (required unique identifier)