@odx/angular 5.3.4 → 5.5.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @odx/angular
 
+## 5.5.0
+
+### Minor Changes
+
+- 40bef6d: Added header navigation component
+- b18ae5a: Allow any content in header. The content is projected into it's own area inside the header
+- 49f971d: Add footer component
+
+### Patch Changes
+
+- 6699568: Allow dynamic text content for main menu title, subtitle and copyright
+
+## 5.4.0
+
+### Minor Changes
+
+- 4375380: Add notification component and service
+
 ## 5.3.4
 
 ### Patch Changes

package/components/footer/README.md

@@ -0,0 +1,3 @@
+# @odx/angular/components/footer
+
+Secondary entry point of `@odx/angular`. It can be used by importing from `@odx/angular/components/footer`.

package/components/footer/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/footer.component';
+export * from './lib/footer.config';
+export * from './lib/models';

package/components/footer/lib/footer.component.d.ts

@@ -0,0 +1,23 @@
+import { DynamicTextContent } from '@odx/angular/cdk/dynamic-view';
+import { trackByIndex } from '@odx/angular/utils';
+import { FooterVariant } from './models';
+import * as i0 from "@angular/core";
+/**
+ * Represents the footer component of an application, dynamically generating links and supporting various styles.
+ * This component integrates dynamic and static content for the footer, including a logo, navigational links, and a customizable description.
+ *
+ * @usage `<odx-footer [description]="dynamicOrStaticContent" [variant]="'light'|'dark'"></odx-footer>`
+ *
+ * @input
+ * - `description` - Accepts dynamic content (observable or static string) for displaying a custom description in the footer.
+ * - `variant` - Sets the footer's appearance theme, supporting `light` and `dark` variants as defined by `FooterVariant`.
+ */
+export declare class FooterComponent {
+    protected readonly footerLinks$: import("rxjs").Observable<import("./models").FooterLink[]>;
+    protected readonly trackByIndex: typeof trackByIndex;
+    readonly element: import("@angular/core").ElementRef<HTMLElement>;
+    description?: DynamicTextContent | null;
+    variant: FooterVariant;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FooterComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FooterComponent, "odx-footer", never, { "description": { "alias": "description"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, {}, never, ["*", "[odxLink]"], true, never>;
+}

package/components/footer/lib/footer.config.d.ts

@@ -0,0 +1,30 @@
+import { MainMenuLinksConfig } from '@odx/angular/components/main-menu';
+import { Observable } from 'rxjs';
+import { FooterLink } from './models';
+export interface FooterLinksConfig extends MainMenuLinksConfig {
+    dynamicLinks?: Observable<FooterLink[]>;
+}
+/**
+ * Creates configuration tokens for the footer links, providing a structured way to inject and manage footer link configurations.
+ * This utility function encapsulates the configuration for footer links, including defaults and the ability to inject custom configurations.
+ *
+ * @returns {Object} An object containing configuration tokens for footer links:
+ * - `FooterLinksConfig`: A token for injecting the footer links configuration.
+ * - `FooterLinksDefaultConfig`: A token representing the default configuration values.
+ * - `injectFooterLinksConfig`: A function to inject the current footer links configuration.
+ * - `provideFooterLinksConfig`: A function to provide a custom configuration for footer links.
+ *
+ * @example
+ * // In your module or component
+ * @NgModule({
+ *   providers: [
+ *     provideFooterLinksConfig({
+ *       legalNoticeUrl: 'https://www.custom-url/legal-notice',
+ *       providerIdentificationUrl: 'https://www.custom-url/provider-identification',
+ *       dynamicLinks: myDynamicLinksObservable
+ *     })
+ *   ]
+ * })
+ * export class MyModule {}
+ */
+export declare const FooterLinksConfig: import("@angular/core").InjectionToken<Partial<FooterLinksConfig>>, FooterLinksDefaultConfig: FooterLinksConfig, injectFooterLinksConfig: () => FooterLinksConfig, provideFooterLinksConfig: <D extends import("@odx/angular/utils").ConfigDependencies<unknown> = import("@odx/angular/utils").ConfigDependencies<Partial<FooterLinksConfig>>>(config: import("@odx/angular/utils").ConfigProvider<Partial<FooterLinksConfig>, D>) => import("@angular/core").FactoryProvider | import("@angular/core").ValueProvider;

package/components/footer/lib/footer.i18n.d.ts

@@ -0,0 +1,3 @@
+import { TranslationObject } from '@odx/angular/internal/translate';
+declare const _default: TranslationObject;
+export default _default;

package/components/footer/lib/helpers/create-footer-links.d.ts

@@ -0,0 +1,12 @@
+import { Observable } from 'rxjs';
+import { FooterLink } from '../models';
+/**
+ * Creates an observable stream of footer links, combining statically configured links with dynamically provided ones.
+ * It leverages the footer links configuration injected from `injectFooterLinksConfig` and optionally includes
+ * dynamic links if provided. All links are filtered to include only those with a non-empty URL.
+ *
+ * @function createFooterLinks$
+ * @returns {Observable<FooterLink[]>} An Observable that emits an array of `FooterLink` objects. Each `FooterLink`
+ * contains a `name` and a `url`. The observable emits updates if the set of dynamic links changes.
+ */
+export declare function createFooterLinks$(): Observable<FooterLink[]>;

package/components/footer/lib/helpers/index.d.ts

@@ -0,0 +1 @@
+export * from './create-footer-links';

package/components/footer/lib/models/footer-link.d.ts

@@ -0,0 +1,4 @@
+export interface FooterLink {
+    name: string;
+    url: string;
+}

package/components/footer/lib/models/footer-variant.d.ts

@@ -0,0 +1,5 @@
+export type FooterVariant = (typeof FooterVariant)[keyof typeof FooterVariant];
+export declare const FooterVariant: {
+    readonly LIGHT: "light";
+    readonly DARK: "dark";
+};

package/components/footer/lib/models/index.d.ts

@@ -0,0 +1,2 @@
+export * from './footer-link';
+export * from './footer-variant';

package/components/header/lib/header.component.d.ts

@@ -2,5 +2,5 @@ import * as i0 from "@angular/core";
 export declare class HeaderComponent {
     readonly element: import("@angular/core").ElementRef<HTMLElement>;
     static ɵfac: i0.ɵɵFactoryDeclaration<HeaderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<HeaderComponent, "odx-header", never, {}, {}, never, ["button[odxMainMenuButton]", "odx-header-title", "odx-action-group, odx-auth", "[odxHeaderAvatar]"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HeaderComponent, "odx-header", never, {}, {}, never, ["button[odxMainMenuButton]", "odx-header-title", "*", "odx-action-group, odx-auth", "[odxHeaderAvatar]"], true, never>;
 }

package/components/header-navigation/README.md

@@ -0,0 +1,3 @@
+# @odx/angular/components/header-navigation
+
+Secondary entry point of `@odx/angular`. It can be used by importing from `@odx/angular/components/header-navigation`.

package/components/header-navigation/index.d.ts

@@ -0,0 +1,3 @@
+export * from './lib/directives';
+export * from './lib/header-navigation.component';
+export * from './lib/header-navigation.module';

package/components/header-navigation/lib/directives/header-navigation-link.directive.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/router";
+export declare class HeaderNavigationRouterLinkDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<HeaderNavigationRouterLinkDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<HeaderNavigationRouterLinkDirective, "[routerLink][odxHeaderNavigationLink]", never, {}, {}, never, never, true, [{ directive: typeof i1.RouterLinkActive; inputs: { "routerLinkActiveOptions": "routerLinkActiveOptions"; }; outputs: {}; }]>;
+}
+export declare class HeaderNavigationLinkDirective {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<HeaderNavigationLinkDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<HeaderNavigationLinkDirective, "[odxHeaderNavigationLink]", never, {}, {}, never, never, true, never>;
+}

package/components/header-navigation/lib/directives/index.d.ts

@@ -0,0 +1 @@
+export * from './header-navigation-link.directive';

package/components/header-navigation/lib/header-navigation.component.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+export declare class HeaderNavigationComponent {
+    readonly element: import("@angular/core").ElementRef<HTMLElement>;
+    centered: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<HeaderNavigationComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HeaderNavigationComponent, "odx-header-navigation", never, { "centered": { "alias": "centered"; "required": false; }; }, {}, never, ["ng-template, [odxHeaderNavigationLink]"], true, never>;
+    static ngAcceptInputType_centered: unknown;
+}

package/components/header-navigation/lib/header-navigation.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./header-navigation.component";
+import * as i2 from "./directives/header-navigation-link.directive";
+import * as i3 from "@odx/angular";
+export declare class HeaderNavigationModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<HeaderNavigationModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<HeaderNavigationModule, never, [typeof i1.HeaderNavigationComponent, typeof i2.HeaderNavigationLinkDirective, typeof i2.HeaderNavigationRouterLinkDirective], [typeof i3.CoreModule, typeof i1.HeaderNavigationComponent, typeof i2.HeaderNavigationLinkDirective, typeof i2.HeaderNavigationRouterLinkDirective]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<HeaderNavigationModule>;
+}

package/components/main-menu/lib/helpers/create-main-menu-links.d.ts

@@ -1,2 +1,3 @@
+import { Observable } from 'rxjs';
 import { MainMenuLink } from '../models';
-export declare function createMainMenuLinks(): MainMenuLink[];
+export declare function createMainMenuLinks$(): Observable<MainMenuLink[]>;

package/components/main-menu/lib/main-menu.component.d.ts

@@ -1,15 +1,15 @@
+import { DynamicTextContent } from '@odx/angular/cdk/dynamic-view';
 import { trackByIndex } from '@odx/angular/utils';
 import { MainMenuService } from './main-menu.service';
 import * as i0 from "@angular/core";
 export declare class MainMenuComponent {
-    protected dynamicLinks: import("rxjs").Observable<import("./models").MainMenuLink[]>;
     protected readonly mainMenuService: MainMenuService;
-    protected readonly mainMenuLinks: import("./models").MainMenuLink[];
+    protected readonly mainMenuLinks$: import("rxjs").Observable<import("./models").MainMenuLink[]>;
     protected readonly trackByIndex: typeof trackByIndex;
     readonly element: import("@angular/core").ElementRef<HTMLElement>;
-    title: string;
-    subtitle: string | null;
-    copyright: string | null;
+    title: DynamicTextContent;
+    subtitle?: DynamicTextContent | null;
+    copyright?: DynamicTextContent | null;
     set isOpen(value: boolean);
     get isOpen(): boolean;
     menuOpen: import("rxjs").Observable<boolean>;

package/components/main-menu/lib/main-menu.config.d.ts

@@ -6,6 +6,7 @@ export interface MainMenuLinksConfig {
     providerIdentificationUrl: string | null;
     termsAndConditionsUrl?: string | null;
     openSourceUrl?: string | null;
+    statusUrl?: string | null;
     dynamicLinks?: Observable<MainMenuLink[]>;
 }
 export declare const MainMenuLinksConfig: import("@angular/core").InjectionToken<Partial<MainMenuLinksConfig>>, MainMenuLinksDefaultConfig: MainMenuLinksConfig, injectMainMenuLinksConfig: () => MainMenuLinksConfig, provideMainMenuLinksConfig: <D extends import("@odx/angular/utils").ConfigDependencies<unknown> = import("@odx/angular/utils").ConfigDependencies<Partial<MainMenuLinksConfig>>>(config: import("@odx/angular/utils").ConfigProvider<Partial<MainMenuLinksConfig>, D>) => import("@angular/core").FactoryProvider | import("@angular/core").ValueProvider;

package/components/notification/README.md

@@ -0,0 +1,3 @@
+# @odx/angular/components/notification
+
+Secondary entry point of `@odx/angular`. It can be used by importing from `@odx/angular/components/notification`.

package/components/notification/index.d.ts

@@ -0,0 +1,7 @@
+export * from './lib/components';
+export * from './lib/directives';
+export * from './lib/features';
+export * from './lib/models';
+export * from './lib/notification.config';
+export * from './lib/notification.service';
+export * from './lib/notification.tokens';

package/components/notification/lib/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './notification-center/notification-center.component';
+export * from './notification-item/notification-item.component';

package/components/notification/lib/components/notification-center/notification-center.component.d.ts

@@ -0,0 +1,19 @@
+import { OnDestroy } from '@angular/core';
+import { trackById } from '@odx/angular/utils';
+import { NotificationRef } from '../../models';
+import { NotificationCenterService } from '../../services';
+import * as i0 from "@angular/core";
+/**
+ * A component for displaying and managing a list of notifications. It integrates various sub-components and directives to provide a rich user interface for notification interaction. Supports animations for notification transitions and leverages Angular's change detection strategies for performance.
+ *
+ * @CSSComponent 'notification-center' - Specifies the CSS class for styling the notification center component.
+ */
+export declare class NotificationCenterComponent implements OnDestroy {
+    protected readonly notificationCenterService: NotificationCenterService;
+    protected readonly trackById: typeof trackById;
+    readonly element: import("@angular/core").ElementRef<HTMLElement>;
+    ngOnDestroy(): void;
+    protected isMuted({ options, hasBeenSeen }: NotificationRef): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationCenterComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NotificationCenterComponent, "odx-notification-center", never, {}, {}, never, never, true, never>;
+}

package/components/notification/lib/components/notification-item/notification-item.component.d.ts

@@ -0,0 +1,37 @@
+import { EventEmitter } from '@angular/core';
+import { Observable } from 'rxjs';
+import { NotificationRef } from '../../models';
+import * as i0 from "@angular/core";
+/**
+ * A component for displaying notifications.
+ * Supports customization through dynamic transformation of notification data.
+ * Utilizes the OnPush change detection strategy for better performance in large applications.
+ *
+ * @component
+ */
+export declare class NotificationItemComponent {
+    private readonly transformNotification;
+    private _notificationRef;
+    protected transformedNotification: Observable<NotificationRef>;
+    readonly element: import("@angular/core").ElementRef<HTMLElement>;
+    /**
+     * Input property to set the notification. On setting, it transforms the notification for display.
+     * This transformation can be a custom logic provided through dependency injection.
+     *
+     * @param value NotificationRef - The notification object to be displayed.
+     */
+    set notification(value: NotificationRef);
+    /**
+     * Getter for the notification property.
+     *
+     * @returns NotificationRef - The current notification reference stored in the component.
+     */
+    get notification(): NotificationRef;
+    /**
+     * An event emitter for dismissing the notification.
+     * It emits the notification reference that was dismissed.
+     */
+    dismiss: EventEmitter<NotificationRef>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NotificationItemComponent, "odx-notification-item", never, { "notification": { "alias": "notification"; "required": true; }; }, { "dismiss": "dismiss"; }, never, never, true, never>;
+}

package/components/notification/lib/directives/index.d.ts

@@ -0,0 +1 @@
+export * from './notification-center.directive';

package/components/notification/lib/directives/notification-center.directive.d.ts

@@ -0,0 +1,69 @@
+import { AfterViewInit, OnInit } from '@angular/core';
+import { DynamicTextContent } from '@odx/angular/cdk/dynamic-view';
+import { Observable } from 'rxjs';
+import { NotificationSortFn } from '../models';
+import * as i0 from "@angular/core";
+import * as i1 from "@odx/angular/components/badge";
+import * as i2 from "@odx/angular/components/dropdown";
+/**
+ * A directive that provides an interface for managing notifications.
+ * It allows configuring a notification center with dynamic content, sorting, and badge display functionalities.
+ */
+export declare class NotificationCenterDirective implements OnInit, AfterViewInit {
+    private readonly badgeDirective;
+    private readonly destroyRef;
+    private readonly disabledController;
+    private readonly dropdownDirective;
+    private readonly notificationCenterService;
+    private readonly dropdownStateChange$;
+    private readonly badgeValue$;
+    /**
+     * Sets the tag for filtering notifications. Only notifications with this tag will be shown in the notification center.
+     * @param value The tag value to filter notifications. If null, all notifications are shown.
+     */
+    set tag(value: string | null);
+    /**
+     * Sets the title of the notification center. The title can be dynamic and change based on the application state.
+     * @param value The title content, which can be a string or an Observable returning a string. Allows for dynamic titles.
+     */
+    set title(value: DynamicTextContent | null);
+    /**
+     * Sets the sorting function used to order notifications within the notification center.
+     * @param value A function that compares two notifications and returns the sort order.
+     *
+     * @example
+     *  sortFfn = (a: NotificationRef, b: NotificationRef) => {
+          if (a.createdAt < b.createdAt) return -1;
+          if (a.createdAt > b.createdAt) return 1;
+          return 0;
+        };
+     */
+    set sortFn(value: NotificationSortFn);
+    /**
+     * An event that is emitted when a new notification is added.
+     * Listeners can use this event to react to new notifications being added to the notification center.
+     */
+    notificationAdd: Observable<import("../models").NotificationRef>;
+    /**
+     * An event that is emitted when a notification is updated.
+     * This can be used to react to changes in notifications, such as their read status or content updates.
+     */
+    notificationUpdate: Observable<import("../models").NotificationRef>;
+    /**
+     * An event that is emitted when a notification is removed from the notification center.
+     * Use this event to handle the removal of notifications, such as cleaning up resources or updating UI elements.
+     */
+    notificationRemove: Observable<import("../models").NotificationRef>;
+    /**
+     * An event that is emitted when a notification is marked as seen.
+     * This event can be used to perform actions when the user acknowledges a notification.
+     */
+    notificationSeen: Observable<import("../models").NotificationRef>;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    private formatBadgeValue;
+    private handleBadgeUpdates;
+    private handleDropdownUpdates;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationCenterDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NotificationCenterDirective, "[odxNotificationCenter]", never, { "tag": { "alias": "odxNotificationCenter"; "required": false; }; "title": { "alias": "odxNotificationCenterTitle"; "required": false; }; "sortFn": { "alias": "odxNotificationCenterSortFn"; "required": false; }; }, { "notificationAdd": "odxNotificationCenterAdd"; "notificationUpdate": "odxNotificationCenterUpdate"; "notificationRemove": "odxNotificationCenterRemove"; "notificationSeen": "odxNotificationCenterSeen"; }, never, never, true, [{ directive: typeof i1.BadgeDirective; inputs: { "odxBadgeVariant": "odxNotificationCenterBadgeVariant"; }; outputs: {}; }, { directive: typeof i2.DropdownDirective; inputs: {}; outputs: {}; }]>;
+}

package/components/notification/lib/features/index.d.ts

@@ -0,0 +1,5 @@
+export * from './with-browser-notifications';
+export * from './with-load-notifications';
+export * from './with-notification-transformer';
+export * from './with-peristent-notifications';
+export * from './with-save-notifications';

package/components/notification/lib/features/with-browser-notifications.d.ts

@@ -0,0 +1,17 @@
+import { NotificationFeature, NotificationRef } from '../models';
+export type BrowserNotificationExtras = Omit<NotificationOptions, 'body' | 'timestamp'>;
+export type BrowserNotification = Notification;
+export type BrowserNotificationFactory = (notificationRef: NotificationRef) => BrowserNotification;
+export type SendBrowserNotificationFn = (notificationRef: NotificationRef) => unknown;
+export interface WithBrowserNotificationsOptions {
+    sendFn?: SendBrowserNotificationFn;
+    extras?: BrowserNotificationExtras;
+    isEnabled?: boolean;
+}
+/**
+ * Configures the application to send browser notifications, using Angular's `ENVIRONMENT_INITIALIZER` for setup.
+ * @function withBrowserNotifications
+ * @param {WithBrowserNotificationsOptions} [options] - Optional configuration for browser notifications.
+ * @returns {NotificationFeature} A notification feature for integration into the application environment.
+ */
+export declare function withBrowserNotifications(options?: WithBrowserNotificationsOptions): NotificationFeature;

package/components/notification/lib/features/with-load-notifications.d.ts

@@ -0,0 +1,18 @@
+import { Observable } from 'rxjs';
+import { NotificationFeature, NotificationRef } from '../models';
+/**
+ * Type definition for a function that loads notifications.
+ * Can return notifications directly as an array, as a Promise, or as an Observable.
+ * @typedef {Function} LoadNotificationsFn
+ * @returns {Observable<NotificationRef[]> | Promise<NotificationRef[]> | NotificationRef[]} The loaded notifications.
+ */
+export type LoadNotificationsFn = () => Observable<NotificationRef[]> | Promise<NotificationRef[]> | NotificationRef[];
+/**
+ * Integrates notification loading into the application environment. This function uses the Angular
+ * `ENVIRONMENT_INITIALIZER` to ensure that notifications are loaded as part of the application's
+ * initialization process.
+ * @function withLoadNotifications
+ * @param {LoadNotificationsFn} loadFn - The function to load notifications.
+ * @returns {NotificationFeature} A notification feature configured to load notifications at startup.
+ */
+export declare function withLoadNotifications(loadFn: LoadNotificationsFn): NotificationFeature;

package/components/notification/lib/features/with-notification-transformer.d.ts

@@ -0,0 +1,26 @@
+import { InjectionToken } from '@angular/core';
+import { Observable } from 'rxjs';
+import { NotificationFeature, NotificationRef } from '../models';
+export type NotificationTransformFn = (ref: NotificationRef) => Observable<NotificationRef>;
+/**
+ * An InjectionToken for the NotificationTransformFn. This token can be used to inject
+ * a custom notification transformation function into the Angular DI system.
+ * @type {InjectionToken<NotificationTransformFn>}
+ */
+export declare const ODX_NOTIFICATION_TRANSFORMER: InjectionToken<NotificationTransformFn>;
+/**
+ * Attempts to inject a NotificationTransformFn from the Angular DI system.
+ * If no provider is found, it returns null.
+ * @function injectNotificationTransform
+ * @returns {NotificationTransformFn | null} The injected NotificationTransformFn, or null if not provided.
+ */
+export declare function injectNotificationTransform(): NotificationTransformFn | null;
+/**
+ * Configures a notification transformation function to be used within the application.
+ * This function provides a mechanism to globally apply transformations to notifications
+ * before they are processed or displayed.
+ * @function withNotificationTransform
+ * @param {NotificationTransformFn} transformFn - The function to transform notifications.
+ * @returns {NotificationFeature} A NotificationFeature configured with the provided transformation function.
+ */
+export declare function withNotificationTransform(transformFn: NotificationTransformFn): NotificationFeature;

package/components/notification/lib/features/with-peristent-notifications.d.ts

@@ -0,0 +1,63 @@
+import { NotificationFeature, NotificationRef } from '../models';
+import { LoadNotificationsFn } from './with-load-notifications';
+import { SaveNotificationsFn } from './with-save-notifications';
+export interface NotificationSerializer {
+    serialize(value: NotificationRef[]): Promise<string>;
+    deserialize(value: string): Promise<NotificationRef[]>;
+}
+/**
+ * Implementation of NotificationSerializer for persistent storage.
+ * @class PersistentNotificationSerializer
+ * @implements {NotificationSerializer}
+ */
+export declare class PersistentNotificationSerializer implements NotificationSerializer {
+    /**
+     * Serializes an array of NotificationRef objects into a string.
+     * @function serialize
+     * @memberof NotificationSerializer
+     * @param {NotificationRef[]} value - The notification references to serialize.
+     * @returns {Promise<string>} A promise that resolves to the serialized string representation of notification references.
+     */
+    serialize(value: NotificationRef[]): Promise<string>;
+    /**
+     * Deserializes a string into an array of NotificationRef objects.
+     * @function deserialize
+     * @memberof NotificationSerializer
+     * @param {string} value - The string representation of notification references to deserialize.
+     * @returns {Promise<NotificationRef[]>} A promise that resolves to the deserialized notification references.
+     */
+    deserialize(value: string): Promise<NotificationRef[]>;
+    private serializeDynamicTextContent;
+}
+export interface WithPersistentNotificationsStorageOptions {
+    storageKey: string;
+    storage: Storage;
+    serializer: NotificationSerializer;
+    idTransformer?: (notificationRef: NotificationRef) => string;
+}
+export interface WithPersistentNotificationsOptions {
+    initFn: LoadNotificationsFn;
+    saveFn: SaveNotificationsFn;
+    storageOptions: WithPersistentNotificationsStorageOptions;
+}
+/**
+ * Initializes and returns a function for loading persistent notifications.
+ * @function initPersistentNotifications
+ * @param {WithPersistentNotificationsStorageOptions} options - The storage options including serializer and storage key.
+ * @returns {LoadNotificationsFn} A function to load notifications from storage.
+ */
+export declare function initPersistentNotifications({ storage, storageKey, serializer, idTransformer, }: WithPersistentNotificationsStorageOptions): LoadNotificationsFn;
+/**
+ * Returns a function for persisting notifications.
+ * @function persistNotifications
+ * @param {WithPersistentNotificationsStorageOptions} options - The storage options including serializer and storage key.
+ * @returns {SaveNotificationsFn} A function to save notifications to storage.
+ */
+export declare function persistNotifications({ storage, storageKey, serializer }: WithPersistentNotificationsStorageOptions): SaveNotificationsFn;
+/**
+ * Configures the application to use persistent notifications, automatically loading from and saving to the configured storage.
+ * @function withPersistentNotifications
+ * @param {Partial<WithPersistentNotificationsOptions>} [options] - Optional configuration for persistent notifications.
+ * @returns {NotificationFeature} A notification feature configured for persistence.
+ */
+export declare function withPersistentNotifications(options?: Partial<WithPersistentNotificationsOptions>): NotificationFeature;

package/components/notification/lib/features/with-save-notifications.d.ts

@@ -0,0 +1,11 @@
+import { Observable } from 'rxjs';
+import { NotificationFeature, NotificationRef } from '../models';
+export type SaveNotificationsFn = (notificationRefs: NotificationRef[]) => Observable<void> | Promise<void> | void;
+/**
+ * Configures the application to automatically save notifications using a specified save function.
+ * This setup integrates with Angular's environment initialization process to ensure notifications are saved as needed.
+ * @function withSaveNotifications
+ * @param {SaveNotificationsFn} saveFn - The function to save notifications.
+ * @returns {NotificationFeature} A notification feature configured to automatically save notifications.
+ */
+export declare function withSaveNotifications(saveFn: SaveNotificationsFn): NotificationFeature;

package/components/notification/lib/helpers/get-notifications-by-tag.d.ts

@@ -0,0 +1,2 @@
+import { NotificationQuery } from '../models';
+export declare function getNotificationsByTags(...tags: Array<string | null | undefined>): NotificationQuery;

package/components/notification/lib/helpers/index.d.ts

@@ -0,0 +1,3 @@
+export * from './get-notifications-by-tag';
+export * from './sort-notifications';
+export * from './to-notification-collection';

package/components/notification/lib/helpers/sort-notifications.d.ts

@@ -0,0 +1,3 @@
+import { MonoTypeOperatorFunction } from 'rxjs';
+import { NotificationRef, NotificationSortFn } from '../models';
+export declare function sortNotifications(sortFn?: NotificationSortFn): MonoTypeOperatorFunction<NotificationRef[]>;

package/components/notification/lib/helpers/to-notification-collection.d.ts

@@ -0,0 +1,3 @@
+import { OperatorFunction } from 'rxjs';
+import { NotificationCollection, NotificationRef } from '../models';
+export declare function toNotificationCollection(): OperatorFunction<NotificationRef[], NotificationCollection>;

package/components/notification/lib/models/index.d.ts

@@ -0,0 +1,8 @@
+export * from './notification';
+export * from './notification-action';
+export * from './notification-collection';
+export * from './notification-feature';
+export * from './notification-options';
+export * from './notification-query';
+export * from './notification-sort-fn';
+export * from './notification.ref';

package/components/notification/lib/models/notification-action.d.ts

@@ -0,0 +1,2 @@
+import { NotificationRef } from './notification.ref';
+export type NotificationAction = (notificationRef: NotificationRef) => void;

package/components/notification/lib/models/notification-collection.d.ts

@@ -0,0 +1,6 @@
+import { NotificationRef } from './notification.ref';
+export interface NotificationCollection {
+    values: NotificationRef[];
+    count: number;
+    isEmpty: boolean;
+}

package/components/notification/lib/models/notification-feature.d.ts

@@ -0,0 +1,5 @@
+import { EnvironmentProviders, Provider } from '@angular/core';
+export type NotificationFeature = EnvironmentProviders & {
+    ɵodxBrand: '@odx/angular/components/notification::NotificationFeature';
+};
+export declare function makeNotificationFeature(provider: (Provider | NotificationFeature)[] | EnvironmentProviders): NotificationFeature;

package/components/notification/lib/models/notification-options.d.ts

@@ -0,0 +1,7 @@
+export interface NotificationOptions {
+    icon: string;
+    tags: string[];
+    dismissable: boolean;
+    action?: string;
+    language?: string;
+}

package/components/notification/lib/models/notification-query.d.ts

@@ -0,0 +1,2 @@
+import { NotificationRef } from './notification.ref';
+export type NotificationQuery = (notificationRef: NotificationRef) => boolean;

package/components/notification/lib/models/notification-sort-fn.d.ts

@@ -0,0 +1,2 @@
+import { NotificationRef } from './notification.ref';
+export type NotificationSortFn = Parameters<Array<NotificationRef>['sort']>[0];

package/components/notification/lib/models/notification.d.ts

@@ -0,0 +1,6 @@
+import { DynamicTextContent } from '@odx/angular/cdk/dynamic-view';
+export interface Notification {
+    id?: string;
+    title: DynamicTextContent;
+    description?: DynamicTextContent;
+}

package/components/notification/lib/models/notification.ref.d.ts

@@ -0,0 +1,9 @@
+import { Notification } from './notification';
+import { NotificationOptions } from './notification-options';
+export interface NotificationRef {
+    id: NonNullable<Notification['id']>;
+    createdAt: number;
+    item: Notification;
+    options: NotificationOptions;
+    hasBeenSeen: boolean;
+}